タブにNext/Previousボタンを設置し、操作を補助するスクリプトをCSS TRICKSから紹介します。
jQuery UI Tabs with Next/Previous
demo
タブの数が多くなると、タブだけのナビゲーションではマウスをちょっとずつ動かす動作が不便なため、定位置でクリックできるように設計した、とのことです。
スクリプトの実装には、jQueryとjQuery UIが必要となっています。
Post on:2009年3月11日
- コンテンツスライダーとツールチップナビゲーションを実装するチュートリアル
- [JS]Apple風の画像ギャラリー：カバーフロースクリプトの決定版 -ContentFlow
- [CSS]CSS3グラデーションの表示サンプルと指定方法のまとめ
- 300,000個以上のアイコンから、無料で利用できる好みのアイコンを探せるサイト -Free Icon Search Engine
- 繊細なラインで構成された、光を描く無料のPhotoshopのブラシ
- [CSS]Firefox 3.0/3.5のCSSのバグ情報のまとめ
- レタープレスエフェクトのチュートリアル、あなたは画像派？ CSS派？
- [JS]CSSスプライトをアニメーションで変更するチュートリアル
- ウェブ用UIの無料のPSD素材が日替わりでダウンロードできる -365psd
- CSS3のコード生成と対応ブラウザが分かるジェネレーター -CSS3 Generator
- [CSS]リスト要素で実装するスタイリッシュな打ち出しコンテンツ
- [JS]丁寧に解説された、LavaLampナビゲーションを作成するチュートリアル
- [CSS]商用サイトでもそのまま利用できるCSSのナビゲーション集
- 商用利用も無料、Tシャツ用のシンボルマークのベクター素材
- [JS]アニメーションのタイミングが絶妙なナビゲーションのスクリプト
