私のワードプレステーマスライダーとして、デフォルトのシャッターテーマを持つJqueryの特大フルスクリーンスライダーがあります。このスライダーの既定のサムネイル コンテナーは、画面の下部で水平です。このサムトレイを画面の右側に垂直にする方法を知っている人はいますか?
特大サイズのデモ リンク:-水平サム トレイを使用したデモ
望ましい結果のデモ リンク:縦型サム トレイを使用したデモ
私のワードプレステーマスライダーとして、デフォルトのシャッターテーマを持つJqueryの特大フルスクリーンスライダーがあります。このスライダーの既定のサムネイル コンテナーは、画面の下部で水平です。このサムトレイを画面の右側に垂直にする方法を知っている人はいますか?
特大サイズのデモ リンク:-水平サム トレイを使用したデモ
望ましい結果のデモ リンク:縦型サム トレイを使用したデモ
jQueryに基づいたもの(競合モードなし)は非常に便利で完全に無料であることがわかりました:http://www.comslider.com :)
supersized.shuter.js で、サム トレイの水平方向の動きを担当するスクリプト行を見つけました。
/* Thumbnail Mouse Scrub
----------------------------*/
if (api.options.mouse_scrub){
$(vars.thumb_tray).mousemove(function(e) {
var containerWidth = $(vars.thumb_tray).width(),
listWidth = $(vars.thumb_list).width();
if (listWidth > containerWidth){
var mousePos = 1,
diff = e.pageX - mousePos;
if (diff > 10 || diff < -10) {
mousePos = e.pageX;
newX = (containerWidth - listWidth) * (e.pageX/containerWidth);
diff = parseInt(Math.abs(parseInt($(vars.thumb_list).css('left'))-newX )).toFixed(0);
$(vars.thumb_list).stop().animate({'left':newX}, {duration:diff*3, easing:'easeOutExpo'});
}
}
});
}
suersized-shutter.css にいくつかの変更を加えて、サムネイルを含む垂直サム トレイを取得しました。特大スライダーのカスタマイズと設定に精通している場合は、適切なカスタマイズを提案してください。