jQueryで特定のセレクタとかが見えているに対してなんかするやつ

2013-03-03T00:00:00+00:00 JavaScript jQuery

http://www.appelsiini.net/projects/viewport っていうのがあるらしい。githubは https://github.com/tuupola/jquery_viewport

でスクロールイベントをバインドしてin-viewport辺りを使う事で特定のセレクタとかが見えている場合になんかしたりとか出来る模様。とりあえずやってみると

(function() {
  var inVisibleViewport = function() {
    $(".content:in-viewport").each(function() {
      console.log($(this).children().text());

      $(window).unbind("scroll", inVisibleViewport);
    });
  };

  $(window).bind("scroll", inVisibleViewport);
})();

そのターゲットとなるセレクタな所がin-viewportで見えたと検知された場合にこのスクロールイベントをunbindするので複数の検知はしないようにしている。で

http://cyrilmazur.com/2011/08/deferred-lazy-loading-facebook-widgets.html

っていうようなFacebookなパーツを特定のセレクタが見えた時にロードするような仕組みも出来るみたい

ちなみに画像を遅延ロードする有名なやつ( http://www.appelsiini.net/projects/lazyload )って同じ所な人が作ってるみたいっすね

mocha-phantomjs PHPUnitでSingleton+staticメソッドをテストするケース