なぜAmazonのメガドロップダウンメニューはスムーズに操作できるのかという秘密
日本のAmazonでも採用されているメガドロップダウンメニューについて、なぜAmazonのメニューはユーザーが使いやすくできているのかという秘密が明らかになりました。ユーザビリティを改善することが至上命題のネットショッピング系サイトにとっては非常に有益な知識となっています。 Breaking down Amazon’s mega dropdown - Ben Kamens http://bjk5.com/post/44698559168/breaking-down-amazons-mega-dropdown まずこれがAmazonの左上にあるカテゴリーを一覧化したメガドロップダウンメニュー。日本のAmazonにも同様のメニューが採用されており、マウスカーソルを上に持っていくと実にスムーズに動きます。 通常のメニューの場合、以下のようにして少し遅れてサブメニューが開くようになっています。 な
ウィンドウサイズに応じてli要素とselect要素を切り替えるレスポンシブなメニューを実装する軽量jQueryプラグイン・Responsive Menu - かちびと.net
ウィンドウサイズに応じてli要素と select要素にスイッチできるjQuery プラグイン、Responsive Menuのメモ。 ブレークポイントを設定して、閲覧 するウィンドウサイズがそのポイント に達したらli要素で作ったメニュー をselectにしてコンパクト化します。 以前、CSS-Tricksでも記事になっていました(参照：Convert a Menu to a Dropdown for Small Screens)が、これと同じ機能です。孫要素までネストされたリストでもselectにスイッチできます。CSS-Tricksのもネスト対応してるかは調べていませんが・・ 普通にPCで見ると左のようにリストに、スマフォのようなウィンドウサイズの狭いデバイスだとselectにスイッチしてコンパクトにしてくれます。これ便利ですよね。 select化されてもネストされた要素はスペースで明
jQueryを使った、動きのあるナビゲーションメニューチュートリアル集 – creamu
スムーズな動きのナビゲーションメニューを作りたい。 そんなときにおすすめなのが、『Excellent jQuery Navigation Menu Tutorials』。jQueryを使った、動きのあるナビゲーションメニューチュートリアル集です。 いい感じのものが揃っていますね。 How to Make a Smooth Animated Menu with jQuery マウスオーバーすると、すとんとメニューの説明を表示 Animated Drop Down Menu with jQuery クリックすると、すっとドロップダウン型で表示されるメニュー How to Create a Drop-down Nav Menu with HTML5, CSS3 and jQuery HTML5,CSS3でのドロップダウンメニューの作り方 How to Build a Lava-Lamp Styl
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
