|
|
新着サンプル
行数:
|
◆ jQueryのShakyMenuプラグインでメニューを振動させる
(#1)
このサンプルは、jQueryの
ShakyMenu
プラグインを利用してメニューを左右に振動させます。サンプルが表示されたらマウスを任意のメニューに移動してください。カレントのメニュー以外が左右に振動します。しばらくすると振動が停止します。
|
◆ jQueryのCLEditorプラグインでHTMLエディタを実装する
(#2)
このサンプルは、jQueryの
CLEditor
プラグインでWYSIWYG HTMLエディタを実装します。
サンプルが表示されたら、テキストを入力して[B],[I],[U]...などのボタンをクリックして編集してみてください。
|
◆ jQueryのSmooth Div Scrollプラグインでイメージをスクロールする
(#3)
このサンプルは、jQueryの
Smooth Div Scroll
プラグインを利用して
イメージを左右にスライドさせます。
サンプルが表示されるとイメージが自動的に左側にスクロールします。
イメージが終端までスクロールしたら逆方向にスクロールさせます。
手動でスクロールするときは左右の矢印にマウスを移動します。
マウスの位置によりスクロールするスピードを調整できます。
|
◆ jQueryのMopSliderプラグインでイメージをアップルのサイト風にスライドさせる
(#4)
このサンプルは、jQueryの
MopSlider
プラグインを利用して
Appleのサイト風にイメージをスライドさせます。
サンプルが表示されたら「Any Words」のハンドルをドラッグして左右に
移動してみてください。イメージが左右にスライドします。
スライダー右端の切り替えボタンをクリックすると「Any Words」
が「Auto」に切り替わって自動的にスライドします。
|
◆ jQueryのInsetBorderプラグインでイメージのボーダーをアニメーション化する
(#5)
このサンプルは、jQueryの
InsetBorder
プラグインを利用してイメージのボーダーをアニメーション化します。ここでは、イメージに５種類のボーダーを表示しています。イメージにマウスを移動するとボーダーがアニメーション化します。
|
◆ jQueryのYouTubeEmbedプラグインでカスタムビデオプレイヤーを表示する
(#6)
このサンプルは、jQueryの
YouTubeEmbed
プラグインを利用して
カスタムビデオプレイヤーを表示します。
サンプルが表示されたら[Click to Play]ボタンをクリックしてビデオを再生します。
停止させるには動画にマウスを移動して[Click to Pause]ボタンをクリックします。
それにしても、この熊賢いですね！
|
◆ jQueryでサムネイルナビゲーションギャラリーを実装する
(#7)
このサンプルは、jQueryとCSSを利用してサムネイルナビゲーションギャラリーを実装しています。サンプルが表示されたら「Newest Collection」の右端に表示されてい[V]をクリックします。サムネイルの一覧が表示されたら任意のサムネイルをクリックして拡大してみてください。サムネイルにマウスを移動して左右に移動するとサムネイルがスライドします。サムネイルを閉じるには[^]をクリックします。
|
◆ jQueryのBubbleEngineプラグインで泡を発生させる
(#8)
このサンプルは、jQueryの
BubbleEngine/BubbleMachine
プラグインを利用して泡を発生させます。
泡はバブルマシンが発生させます。
サンプルが表示されると２台のバブルマシンから泡がでます。
[Add a new Bubble Machine]ボタンをクリックすると、バブルマシンを追加します。
泡の種類は「Type」から選択することができます。１番目のタイプを選択するとハート型の泡がでます。３番目のタイプを選択するとツイッター型の泡がでます。２番目のタイプを選択すると、通常の泡ができます。泡の大きさはスライダーで変えることができます。
バブルマシンとコントールパネルは、ドラッグして任意の場所に移動することができます。
|
◆ jQueryのjYouTubeプラグインでビデオのサムネイルを取得する
(#9)
このサンプルは、jQueryの
jYouTube
プラグインを利用してYouTubeのビデオのサムネイルを生成して表示します。
サンプルが表示されたら、テキストボックスにビデオのURLを入力して[Get Thumbnail]ボタンをクリックします。
テキストボックスのURLを書き換えて試してみてください。
|
◆ jQueryのdragsortプラグインで要素を並べ替える
(#10)
このサンプルは、jQueryの
DragSort
プラグインで要素をドラッグしながら並べ替えることができます。
サンプルが表示されたら、「Simple 1D list」のアイテムをドラッグして並べ替えてみてください。「2D list with drag and drop between lists」では、２つのリストボックス間でアイテムを移動することができます。さらに、移動したアイテムはリスト内で並べ替えることができます。
|
|