1. TOP
  2. javascript

[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'));
      });
    }
  });
})();

ウィンドウ下部に固定、スクロールでニョキっと出す方法 殴り書きその1

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

IE6には対応していない。position:fixed;が効かないため。

このコードでは動かないけどだいたいこんな感じのイメージです。jQueryをきちんと読み込んでください。

css

#footer {
    position: fixed;
    display:none;
    bottom: -380px;
    width:100%;
    height:400px;
}

javascript

// jQueryが必要です。
(function(){
	var intervalValue = 300;
	var pageTopID = '#footer';
	 
	$(window).scroll(function () {
		var distanceTop = $(document).scrollTop();
        // この辺を改造する
		var winTop = $(window).height();
		var conTop = $("#container").height();

        // 画面がどれだけスクロールされたか判定する
		if (distanceTop > intervalValue) {
        	// にょきっとだす
			$(pageTopID).slideDown();
			if(distanceTop > (conTop - winTop)){
            	// 画面最下部までいったとき処理
			}
			if(distanceTop < (conTop - winTop)){
            	// 最下部からスクロールを戻したときの処理
			}
		}
		if (distanceTop < intervalValue) {
        	// にょきっとしまう
			$(pageTopID).slideUp();
		}
	});
})();

これ、positionがfixedで、height:400px;、bottom:-380px;指定なのでfooterの上から20px分が、300pxスクロールしたらニョキっとでてくる感じになります。 で、最下部までいったら#footer自体がスクロールとともに現れるように画面最下部までいったとき処理を書いてください。

offset()でやるとposition:fixed; bottom:0;が解除されてしまう様なので、別の書き方をしなければなりません。とりあえずのなぐりがき。

ページの先頭に戻る