シンプルだけどデザインがよいドロップダウンメニュー実装チュートリアル:phpspot開発日誌
Simple Drop Down Menu with Jquery and CSS シンプルだけどデザインがよいドロップダウンメニュー実装チュートリアル 未オープン状態の場合はテキストっぽく表示されて、クリックするとホバーされるメニューの実装チュートリアルです。 クリックするとホバーされてメニューが表示されます。 マークアップは以下のようにシンプル。 idを付け替えつつ、show() hide() しているだけなわけで、大層なことはやっていないわけですが、似たようなものを作る際の参考に使えそうでしたのでご紹介 関連エントリ フリーのCSSメニューテンプレートとチュートリアル集 CSSのナビゲーションメニューサンプル５５
[JS]レスポンシブデザインもOK、水平タイプのナビゲーションをいい感じにするスクリプト -HorizontalNav
リスト要素で実装した水平タイプのナビゲーションのスタイルを壊すことなく、配置エリア・表示サイズに合わせて最適化するjQueryのプラグインを紹介します。 HorizontalNav [ad#ad-2] HorizontalNavのデモ HorizontalNavの使い方 HorizontalNavのデモ 水平タイプのナビゲーションの見た目は通常、成り行きや指定したサイズになりますが、HorizontalNavを使用すると配置エリアのサイズに合わせて各アイテムのサイズを均等にします。 デモ：480pxで表示 上：未適用はが成り行きで二段になってしまう幅になっても、下：適用の見た目は損なわれません。 HorizontalNavの使い方 実装は4ステップです。 Step 1: 外部ファイル 「jquery.js」と当スクリプトを外部ファイルとして記述します。 <script src="//aja
ドロップダウンするページ内スクロール用の固定ナビゲーションを実装するjQueryプラグイン・fixedTOC - かちびと.net
個人的に使いそうなのでメモ。 よくあるページ内スクロールを 固定させてドロップダウン式に するjQueryプラグインです。 これはなかなか実用性があると 思います。 プラグインとしてはちょっと今更感あるかもですけど。 位置固定+ドロップダウン+アコーディオン+ページ内スクロール、みたいなやつです。結構いいんじゃないかなと感じました。 サンプル用意しました。 Sample コード <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> <script src="js/jquery.fixedTOC.js"></script> <script> $('#toc').fixedTOC({ menuOpens: 'click', // or 'mouseenter' scroll
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
