jQueryプラグインNivo Sliderのカスタマイズ箇所の備忘録。
【エフェクトの種類】
sliceDown
sliceDownLeft
sliceUp
sliceUpLeft
sliceUpDown
sliceUpDownLeft
fold
fade
random
slideInRight
slideInLeft
------------------------------------------------------
Nivo Sliderの詳細設定
JavaScriptで詳細設定が可能。
<script type="text/javascript">
$(window).load(function() {
$('#slider').nivoSlider({
effect:'random', //エフェクトの種類
slices:15,
animSpeed:500, //スライドのエフェクトの時間
pauseTime:3000,//スライドの表示の時間
startSlide:0, //初めに表示するスライド番号 (0 index)
directionNav:true, //前後ナビゲーションボタンの表示・非表示
directionNavHide:true, //マウスが画像から外れた時前後ナビゲーションボタンが非表示にする
controlNav:true, //コントロールナビゲーションボタンの表示・非表示
controlNavThumbs:false, //コントロールナビゲーションボタンにサムネイル画像を使う
controlNavThumbsFromRel:false, //imgタグのrelからサムネイル画像のファイル名を取得する
controlNavThumbsSearch: '.jpg', //サムネイル画像の拡張子
controlNavThumbsReplace: '_thumb.jpg', //サムネイル画像の名前の置き換え
keyboardNav:true, //キーボードで前後ナビゲーションする
pauseOnHover:true, //マウスオーバーでスライド停止する
manualAdvance:false, //マニュアルで設定
captionOpacity:0.8, //キャプションの透明度
beforeChange: function(){}, //画像が変わる前に実行するスクリプトを入力
afterChange: function(){}, //画像が変わった後に実行するスクリプトを入力
slideshowEnd: function(){}, //スライドがすべて終わった後実行するスクリプトを入力
lastSlide: function(){}, //最後の画像が表示された時に実行するスクリプトを入力
afterLoad: function(){} //スライドがロードされた後に実行するスクリプトを入力
});
});
</script>
posted by ITF at 20:47| 奈良 ☁|
Comment(0)
|
チュートリアル
|

|