Slides


Description: 多くの形に対応できる高機能コンテンツスライダープラグインです。テキストなどや画像ギャラリー、上記画像のようなサムネイルギャラリーなども構築可能。表示は多少崩れますが、IE6でも動作するクロスブラウザ対応です。
Sample: demo
Tutorial: Slides
License: -

Sample

1144953 3 2x1144953 3 2x1144953 1 2x1144953 2 2x1144953 4 2x1144953 5 2x1144953 6 2x1144953 6 2x
  • 1144953 3 2x
  • 1144953 3 2x
  • 1144953 1 2x
  • 1144953 2 2x
  • 1144953 4 2x
  • 1144953 5 2x
  • 1144953 6 2x
  • 1144953 6 2x

Note

$(function(){
			$('#products').slides({
				preload: true,
				preloadImage: 'img/loading.gif',
				effect: 'slide, fade',
				crossfade: true,
				slideSpeed: 200,
				fadeSpeed: 500,
				generateNextPrev: true,
				generatePagination: false
			});
		});

jQueryとプラグインファイルに加えて上記設定をします。

Related snippet :

  • Description: クロスブラウザに対応したシンプルで使い勝手の良いギャラリー系プラグインです。マークアップもシンプルで導入も手軽に行えます。 Sample: ...
  • Description: 左のサムネイルにマウスオーバーするとアニメーションエフェクト付きで拡大、クリックすると右の大きな画像が切り替わる、というイメージギャラリーです。 ...
  • Description: ソート出来るポートフォリオを構築できます。IE6や7でも動作しますが、アニメーションが少々怪しい感じです。class名を振ってソートするシンプルな手 ...
  • Description: マウスオーバーでアイコンがスムーズに拡大し、キャプションもツールチップ的に表示させます。全てのブラウザで動作してくれます。 Sample: ...
  • Description: シンプルなカルーセルを実装するプラグインです。ボタンで進ませることが出来ます。マークアップがとてもシンプルで使いやすそうですね。 Samp ...
  • Description: Appleのスライドショーのようなギャラリーを構築するチュートリアルです。デモではcss3と、IE7のハックを用いているので汎用的とは言えませんが、 ...
  • Description: ビフォーアフターを実装するプラグインです。クロスブラウザで動いてくれますよ。実装にはjqueryUIが必要です。 Sample: dem ...