ユニークなエフェクトがある画像ギャラリーJavaScript「COIN SLIDER」

画像ギャラリーのJavaScriptがあふれる中、少しでも特徴感を出したいものです。
Coin Slider: jQuery Image Slider Plugin with Unique Effectsは少し変わった切り替えエフェクトを持つ、プラグインです。
これを利用して、オリジナル感を出してみてはいかがでしょうか。
ユニークなエフェクトがある画像ギャラリーJavaScript「COIN SLIDER」サンプル

使用方法
Coin Slider: jQuery Image Slider Plugin with Unique Effectsからファイルをダウンロードします。
また、jQueryからjquery.jsをダウンロードします。
<link rel="stylesheet" type="text/css" href="coin-slider-styles.css">
<script type="text/javascript" src="jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="coin-slider.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#id名').coinslider({
width: 400, //画像幅
height: 320, //画像高
spw: 7, //画像切替時の横四角数
sph: 5, //画像切替時の縦四角数
effect: 'random', // エフェクト(random, swirl, rain, straight)
});
});
</script>

上記記述後、下記ルールで画像を書いていきます。
<div id="id名">
<!-- ここから1画像 -->
<a href="#" target="_blank">
<img src="画像パス">
<span>
画像キャプション
</span>
</a>
<!-- ここまで1画像 -->
<!-- 繰り返し -->
</div>

ユニークなエフェクトがある画像ギャラリーJavaScript「COIN SLIDER」サンプル

sponsors

「ユニークなエフェクトがある画像ギャラリーJavaScript「COIN SLIDER」」をシェアする

記事作成:
記事URL:

TOP > > > ユニークなエフェクトがある画像ギャラリーJavaScript「COIN SLIDER」