TOP  >  plugin  >  CSS3とjQueryで実現する55のタブメニュー「55+ Free CSS3 jQuery Tab Menu Plugins」
2013年10月18日

CSS3とjQueryで実現する55のタブメニュー「55+ Free CSS3 jQuery Tab Menu Plugins」

Webサイトの機能を考えたりコーディングに落とし込む時、いつも決まった方法を取ってしまいがち。時には違う手法を取り入れることで、知識は更に深まるかもしれません。そんな中今回は、狭い範囲に多くの情報を掲載できる、タブ機能のさまざまな実現方法「55+ Free CSS3 jQuery Tab Menu Plugins」を紹介したいと思います。

55fcjtmp_0
Tabslet jquery plugin | Yet another plugin for tabs

CSSのみで実現できるもの、jQueryで実現するもの、両方を使うものなど、様々な手法が紹介されています。中でも気になったものをピックアップしましたので、下記よりご覧ください。

詳しくは以下

BETI jQuery – Animated Tabs Preview – CodeCanyon
メニューが横に付いた少し珍しいタイプのタブ。動作自体は全てjQueryで実現しています。

55fcjtmp_1
　
　
　
　
　
CSS3 flat responsive tabs | CSSDeck
画面幅によってフレキシブルに変化するタブ。スマートフォン表示に対応したサイトにもってこいですね。

55fcjtmp_2
　
　
　
　
　
Stu Nicholls | CSSplay | CSS tabbed pages with persist and other features
CSSのみで実現できるタブ。作りが非常にシンプルなので導入コストが少なくてすみそうです。

55fcjtmp_3
　
　
今回紹介したタブのように、1つの機能に対してもさまざまな実現方法があります。異なる方法を学ぶ事によって新たな機能のアイデアが生まれそうです。他にもさまざまな種類のタブがまとめられていましたので、気になる方は下記サイトをご覧ください。

55+ Free CSS3 jQuery Tab Menu Plugins | Designrazzi

※当サイトのに掲載されている一部画像、スクリ－ンショットに文章に置いては第三十二条で定められる引用の範囲で使用していますが、万が一問題があればこちらからご連絡ください。即刻削除いたします。
posted 10:00  |  
Category: plugin   
tag: CSS3 Design jQuery plugin デザイン プラグイン
このエントリーをはてなブックマークに追加

関連記事

ユーザーフレンドリーにするための40の新しいjQueryプラグイン「40 Fresh jQuery Plugins To Make Your Website User Friendly」 jQueryを利用した20の開閉式メニュープラグイン「20 jQuery Side Sliding Panel Plugins (show-hide) For Your Website」 魅力ある動きを可能にしてくれる フリーjQueryプラグイン「14 Free Frontend jQuery Plugins」 webサイトの動きを魅力的に演出する フリーjQueryプラグイン集「Free jQuery Plugins To Create An Amazing Website」

Sponsor

最近の記事

【ご注意】「Designworks」の旧ホームページドメインを利用したWEBサイトにご注意ください 【商用可】アナログ感のあるドローイングフリーフォント「THRONE」 アイコンサイズやカラーを選んでSVGで出力できる「ICONSVG」 子どもをイメージしたフリーフラットアイコンセット「Download free Childhood flat icons set」 クリエイター向けモックアップテンプレートまとめ「15 Free Hero & Scene Creator Mockup Templates for Photoshop」 バレンタインを楽しく演出するフリーアイコンセット「50 free valentines themed icons」 インスタグラムの投稿をおしゃれに彩るフリーテンプレートまとめ「10 Free Instagram Story Templates」 花を抽象的にイメージしたパターン素材「Art Dimension abstract patterns」 個性的なラインナップを楽しめるフリーアイコンセット「Emojious Icons」 最新のクリエイティブなフリーフォントまとめ「20 New Free Fonts For 2019」

このブログを購読する

facebook
twitter
rss

Designdevelopについて

デザインを開発するという視点からデザイン、WEBデザインに役立つ情報をお伝えします。

ご意見、ご感想、連絡事項があればFacebookページよりお願いたします。

※当サイトのに掲載されている一部画像、スクリ－ンショットに文章に置いては第三十二条で定められる引用の範囲で使用していますが、万が一問題があればFacebookページからご連絡ください。即刻削除いたします。
※本ブログの「プライバシーポリシー」です。

関連サイト

Designdevelopの姉妹ブログ、毎日のインスピレーションに！をコンセプトに、グラフィックデザインからプロダクトデザインまでクリエイティブをテーマに取り上げていくブログ「DesignWorks」を運営中。

【ご注意】「Designworks」の旧ホームページドメインを利用したWEBサイトにご注意ください
Template deisgn by iDEACLOUD inc.
トップに戻る