知っておくと効率的！コーポレートサイト制作が捗るjQuery プラグインや使い方まとめ
作成：2014/04/7 更新：2014/11/01 Web制作 > あの企業サイトで使われている効果やテクニックをまた探さないといけない、そもそもどういったキーワードで探したらいいのか分からない。そんなこんなで、今回は奇抜なものではなく、「企業サイトで見たことある！」というような、コーポレートサイトに使えそうな定番のプラグインや作り方をまとめました。 エンジニア速報は Twitter の@commteで配信しています。 もくじ スライドショー １．カルーセル（横） ２．フェードアウト ３．画像と文字をスライド ４．文字が遅れて移動する効果 ５．異なるタイミングを設定できる ナビゲーション・メニュー ６．多階層 ドロップダウンメニュー ７．多階層 効果つき ８．スマホではドロップダウン ９．スマホではセレクトメニューに １０．Amazon風 メガドロップダウンメニュー １１．横スライド １
テーブルを簡単にカッコよくスタイリングできるjQueryプラグイン「tablecloth.js」:phpspot開発日誌
テーブルを簡単にカッコよくスタイリングできるjQueryプラグイン「tablecloth.js」 2012年05月08日- tablecloth.js テーブルを簡単にカッコよくスタイリングできるjQueryプラグイン「tablecloth.js」 $('table').tablecloth() と記述で簡単にテーブルをカッコよくスタイリングできます。テーマも選べる模様。 ソート可能にしたり、ストライプなデザインにしたりといったカスタマイズも可能。 実装できるデザイン例。Twitter Bootstrap と組み合わせたテーマ２種類とその他２種類のテーマがデモとして表示されています 意外と手間取るテーブルデザインですが、こうしたものを参考に美しくデザインしたいものですね 関連エントリ CSS3でクールな角丸テーブルを作る例 シンプルにテーブルにソート機能を持たせるだけのjQueryプラグイ
ソートが無駄にアニメーションしてカッコいいテーブル実装jQueryプラグイン:phpspot開発日誌
MITYA.CO.UK | Scripts | Animated table sort (REGEXP friendly) ソートが無駄にアニメーションしてカッコいいテーブル実装jQueryプラグイン。 どこからどこに移動するというのが目視で確認できるので、無駄に、というのは言い過ぎかもで便利かもしれません。 テーブルの内容が、「ほげほげ(111)」のような文字を含む値であっても、正規表現で数値をマッチさせることでソートするなんて機能もあるみたいです。 比較テーブルなんかで使うと分かりやすい比較のUIが作れそうです。 関連エントリ jQueryベースの多機能グリッドテーブル「DataTables」 CSV形式のデータを簡単にテーブルに出来るjQueryプラグイン「csvtotable」 ドロップダウンメニューにテーブルやフォーム等何でも埋め込んでしまえるjQueryプラグイン「MegaMe
ローンチまでのカウントダウンをするページのテンプレートファイル一式
ローンチするまでの日にちと時間をカウントダウンするページのテンプレートファイル一式をOurTutsから紹介します。 Free "Site Under Construction" Template demo デモサイトでは、ロゴ、メールアドレスや電話番号などがダミーで配置されており、ローンチするまでのカウントダウンとコンテンツスライダーが揃ったものとなっています。 主な特長は以下のとおり。 jQueryを使用したカウントダウン jQueryを使用したコンテンツスライダー PSDファイル付き モダンでクリーンなタイプフェイス テーブルを使用しない100%CSSベースのレイアウト validなXHTML 1.0 Transitional validなCSS 2.1 クロスブラウザ対応 IE6, Fx3, Safari2, Op
[JS]テーブル内のコンテンツをセル間で移動可能にするスクリプト
Drag and drop table content with JavaScript demo デモではテーブル内のコンテンツをドラッグ&ドロップでセル間の移動が可能で、配置したコンテンツの量でセルの高さも変更します。 スクリプトはjQueryなど他のスクリプトに依存せず単体で動作するもので、対応ブラウザはIE6をはじめFx3にも対応しています。
[JS]ソートだけでなく、検索も可能な多機能なデータテーブルを実装するスクリプト
セルのハイライト表示、データのソート、特定文字列の検索などに対応したデータテーブルを実装するスクリプトを紹介します。
[JS]設置も簡単なテーブルのデータをソートする超軽量のスクリプト | コリス
leigeberから、既存のテーブルにも簡単に設置できる、データをソートする超軽量（1.7KB）のスクリプトを紹介します。 jQueryやPrototypeなど他のスクリプトは必要ありません。 JavaScript Table Sorter demo 動作確認ブラウザは、IE 6/7/8, Fx2/3, Op, Safari, Chromeとなっています。 設置方法は簡単で、既存のものにも簡単に組み込めます。 「script.js」と「style.css」を外部ファイルとして記述します。 tableに「class="sortable" id="sorter"」を記述します。 テーブルの下に下記のスクリプトを記述します。 <textarea name="code" class="html" cols="60" rows="5"> <script type="text/javascript">
21+ Fresh Ajax CSS Tables - noupe
Not many web designers have fun when it comes to styling tabular data. We have taken a close look at today's best functioning and styled tables to showcase over 15 modern css and Ajax tables teaching you some useful techniques for displaying information in a tabular mode using sorting or filtering functions. You might be interested to take a look at the links below: 47+ Excellent Ajax CSS Forms 37
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
今風のウェブを作る際に使えるCSS/HTML/JSのテンプレ『Easy Front-End Framework』 - 100SHIKI 〜 世界のアイデアを日替わりで
HTMLテーブルの行を見やすくするテーブルクロスJavaScript*ホームページを作る人のネタ帳