5509

チェックボックスとかラジオボタンには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

HTML5で追加されるclassList APIについてのメモ

一部嘘を付いていたので修正しました。has ⇛ contains
WHATWGのリンク先も修正しました。ありがとうございます><

簡単に調べたメモ。特に進展はないよ。

早い話jQueryのaddClassやremoveClass、hasClassっていうメソッドをネイティブに実装するからみんな楽朕っていうやつです。

Read more

jQueryをmootoolsなどの他のライブラリと干渉しないようにする方法まとめ

ブログとかのプラグインでよく分からず使ってる人もいるみたいですし。結論は一番上のやつやってればいいんですけど、というか、プラグインソースは全部こうなってないとだめなんですけど、古いソースコードはそうなっていないものもあったりして(thickboxとか)、思いつく方法全部書き出します。

Read more

Author

nori
nori
- UI Engineer
Location
- ,