1. TOP
  2. javascript

[pushState + ajax] ページの動的遷移 PJAXを実装してみよう・・・?

カテゴリ:
Web
javascript
雑記
| トラックバック(0)
投稿者:yo yo

今更誰にも聞けないPJAXの実装をやる。他ページの特定のDOM内をシームレスに持ってこれる。しかも高速。URLも綺麗。SEO的にも問題ない。特ダネじゃないか。

で、3つくらいあるみたいなんだけど、何が違うのか解らない。この時点で詰んでるし面倒くさい。とりあえずjquery-pjaxから実装してみる。

コード

jQuery PJAX(defunkt版)を使って検索結果の表示とURLをシームレスに切り替える。

html

	

javascript



公式ではこんな感じな筈。

[js] #jsdo.it levGatheringLine js+HTML5 「canvasでパーティクルを操作」

カテゴリ:
Web
javascript
| トラックバック(0)
投稿者:yo yo

Flash版はこちら

サムネイル

160809img01.jpg

[html/js] もうjs/jQueryを使うときはデータ属性(data-*)でなんとかして

カテゴリ:
HTML / CSS
Web
javascript
| トラックバック(0)
投稿者:yo yo

みたい。いや、そうしていくべきなんじゃないの?で、IDとclassはcssでのデザイン関係のみにして切り分けるとかどうだろうか。いや解らない。けどまぁこんな感じで。


[js] このjavascriptのプロファイラがスゴイ

カテゴリ:
Web
javascript
| トラックバック(0)
投稿者:yo yo

sjsp(しんぷるじゃばすくりぷとぷろふぁいら?)がスゴイ。便利。セクシー。

シンプルでかつ最高のJavaScriptプロファイラ sjsp を作りました! ― Webアプリケーションが複雑化する中でプロファイラに求められるものとは何か - プログラムモグモグ
http://itchyny.hatenablog.com/entry/2015/07/01/120000

こんな頭の良くて実行力がある人がいるなんて恐ろしい世の中。見習わないと!

[js] Retina(高精細)ディスプレイ対応的な何か

カテゴリ:
Web
javascript
| トラックバック(0)
投稿者:yo yo

ピクセルレートによって切り替える

(function(){
  if(window.devicePixelRatio > 1) {
    $('img').each(function() {
      $(this).attr('src', $(this).attr('src').replace(/(.jpg|.png|.gif)/gi,'@2x$1'));
    });
  }
})();

レスポンシブ上でbody.widthの幅で出し分ける

これは色々おかしいけど、気にしない。

(function(){
  $(window).on('load resize', function(){
    if($("body").width() < 641){
      $('img').each(function(){
        $(this).attr("src", $(this).attr('src').replace('@1x','@2x'));
      });
    }else{
      $('img').each(function(){
        $(this).attr("src", $(this).attr('src').replace('@2x','@1x'));
      });
    }
  });
})();
ページの先頭に戻る