5509

ページ内の画像がどっしり構えるjQueryプラグイン NiohRoad

この前のLazyLoadの話で、LazyDisplayっていうのも作ったりしましたけど・・・

フワッと出てくる時にイラッとするから止めて欲しいな。文章中の画像表示にエフェクト要らない派なんで、スクロールしたら落ち着いてどっしりそこに構えてて欲しいな。 via

なるほど把握しました。こういうことですか?(某GAZINEから拝借)

というわけで例によってプラグインにしました

チェックボックスとかラジオボタンにはlabelを・・・

labelでwrapされてないチェックボックスとかラジオボタンが多い気がするんですけど(たまたまかもしれないけど)、これってそんなに面倒くさいことですかね・・・いやいやこの記事読んでくれてる人にはいないと思うんですけど。

チェックしやすいのはどっち

hoge
fuga

これをlabel要素で囲って


ってするだけですよね。チェックボックスのラベルっぽいところをクリックして文字選択になったときのあの感じ・・・!

画像に遅延表示っぽいエフェクトを与えるだけのm5LazyDisplay

スクロールしていくとフェードインで表示していくだけのプラグインです。本当にそれだけ。HTTPリクエスト減らすとか、ページロード早くなるとか一切ないです。スクロールしていったときにふわっと表示されるだけです。ちょっと注目ひきたいときに。

サンプル見てもらえば何となく伝わると思います

下記のエントリも併せてどうぞ(セットになってます)
スクロールするまで画像を読み込まない(はずの)Lazy Loadについて

ダウンロード

ダウンロードはgithubから

使い方とかをざっくりと

対象にしたい画像に実行するだけです。

$("img").m5LazyDisplay();

本当に

ただのエフェクトだけなんで

スクロールするまで画像を読み込まない(はずの)Lazy Loadについて

Webパフォーマンスを考える上で重要なことのひとつにHTTPリクエストを減らすというのがありますが・・・

HTTPリクエストを減らすために、画像の遅延読み込みをすると噂のLazy Loadっていうプラグインがあって、結構色んなサイトで使われているのを見るので、一言言っとくか的な感じで書こうとしたらいつからかプラグインページに以下の注意書きが追加されてた

2012-01-10 追記:仕様変更して対応されたようです。とは言え、微妙な感じですが
http://www.appelsiini.net/projects/lazyload

Lazy Load is currently not usable. It does not work with the latest browsers as expected. I have currently no time updating the code myself. Patches are always welcome. If you find a solution just fork and send a pull request. Thanks!

via: Lazy Load Plugin for jQuery

新しいブラウザだと期待した通りの動きをしない、というか遅延読み込みが出来ないから使う意味がないっていう感じです。むしろHTTPリクエストを実質減らせないどころか増やすので今現在使うのはとても微妙な感じです。増やすって言っても表示後にリクエストするんで、ちょっと違いますけど。

というか昔はできてたんかな・・・その辺まで調べきれてないのでアレです。。

Read more

Author

nori
nori
- UI Engineer
Location
- ,