Webデザイナー向けの7つの強力な画像カルーセル

この記事は、Webプロジェクトですぐに使用できる強力な画像カルーセルとテキスト資料のコレクションです。 アジャイルカルーセル、YUIカルーセル、JCarousel、iCarousel(jQuery + MooTools)、およびPrototype-UIを使用してFlickrでカルーセルのような単純なカルーセルを実装する方法に関するチュートリアルが含まれています。

このトピックに関する他の興味深いソリューションを提供したい場合は、コメントを残してください。 よろしくお願いします!



1.アジャイルカルーセル



アジャイルカルーセル アジャイルカルーセルは、拡張された設定セットを使用して非常に柔軟なカルーセルを作成できるjQueryプラグインです。 各フレームのテキストと画像、および現在のフレームを表示するナビゲータをサポートしています。 彼女が実際に動いているのを見るためにここを見てください。



2. Yahoo! UIカルーセルコントロール



Yahoo! UIカルーセルコントロール Yahoo! UIカルーセルコントロールは、ページ上のオーバーレイ領域に垂直または水平に配置された一連の類似オブジェクトを表示するためのウィジェットを提供します。 「カルーセル」のメタファーは、フィルム写真の時代のスライドのカルーセルとの類推から得られます。 カルーセルウィジェットはこのメタファーをたどることができ、すべてのコンテンツフレームを連続的にサークルナビゲーションできます。



3. jCarousel



jカルーセル jCarouselは、ブロックリストを水平または垂直に管理するためのjQueryプラグインです。 静的なHTMLを含むことができるブロック、またはAJAXを含む(または含まない)コンテンツを読み込むことができるブロックは、前後にスクロールできます(アニメーションありまたはなし)。



4. jCarousel Lite



jCarousel Liteは、画像とHTMLコンテンツのカルーセルを旅するjQueryプラグインです。 簡単に言えば、このウィジェットを使用して、カルーセルスタイルで画像やHTMLをナビゲートできます。 このプラグインは非常に軽量で、約2 KBですが、ほとんどのニーズに合わせて非常に柔軟でカスタマイズ可能です。



5.シンプルなFlickrスタイルのカルーセル



シンプルなFlickrスタイルのカルーセル このチュートリアルでは、一連の画像からカルーセルを実装して、 Prototype-UIライブラリを使用してFlickrスタイルのスライドショーを作成する方法を示します。





6. iCarousel



iCarousel iCarouselは、MooTools v1.1を使用して構築された強力なカルーセルであり、わずか数ステップでユーザーが完全にカスタマイズできます。 JSON形式の設定オブジェクトでクラスを初期化するだけで、デフォルトのパラメーターを変更できます。 このカルーセルは、Internet Explorer、Firefox、Opera、およびSafariでテストされています。



7. Carousel.us



Carousel.us Carousel.usは、Christophe BalesのMooToolsとReflection.js、またはReflection.jsとともにPrototype.jsとScript.aculo.usをベースとして使用する、最新の3次元Javascriptカルーセルです。 彼女が実際に動いている様子をご覧ください。



All Articles