jquery.galleryview:複数画像をギャラリー&スライダー表示してくれるJs



複数のjpg画像をイイ感じにギャラリー(スライダー)表示してみます。

1.読込むCSSファイル

<link type="text/css" rel="stylesheet" href="css/jquery.galleryview-3.0-dev.css" />

 

2.読込むJsファイルとJavaScriptの記述例

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js"></script>
<script type="text/javascript" src="js/jquery.timers-1.2.js"></script>
<script type="text/javascript" src="js/jquery.easing.1.3.js"></script>
<script type="text/javascript" src="js/jquery.galleryview-3.0-dev.js"></script>
<script type="text/javascript">
	$(function(){
		$('#myGallery').galleryView();
	});
</script>

 

3.HTMLの記述例

	<ul id="myGallery">
		<li><img src="i1.jpg" alt="1枚目の画像" /></li>
		<li><img src="i2.jpg" alt="2枚目の画像" /></li>
		<li><img src="i3.jpg" alt="3枚目の画像" /></li>
		<li><img src="i4.jpg" alt="4枚目の画像" /></li>
		<li><img src="i5.jpg" alt="5枚目の画像" /></li>
	</ul>

 

jquery.galleryview:複数画像をギャラリー&スライダー表示するデモページ

ギャラリー系の見せ方って他にも色々と
プラグインがあったりしますよね。

色々種類が有り過ぎて何が最適なプラグインなのか知りたいです。