带有垂直拇指托盘的超大全屏滑块

Question

我有一个带有默认快门主题的Jquery超大全屏滑块作为我的wordpress主题滑块。此滑块的默认缩略图容器是屏幕底部的水平。有没有人知道如何在屏幕右侧垂直放置拇指托盘？

超大尺寸的演示链接：- demo with Horizontal thumb-tray

所需结果的演示链接：demo with vertical thumb-tray

Answer 1

我发现这个基于jQuery (无冲突模式)的方法非常有用，而且完全免费：http://www.comslider.com :)

Answer 2

请参阅以下链接

看第二个演示

http://www.menucool.com/slider/jquery-slideshow

其他参考文献

http://evoslider.com/demo3.html

Answer 3

在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中做了一些更改，我得到了包含thumbnails.But的垂直拇指托盘，在这个垂直托盘中，我的拇指水平移动和隐藏，而不是沿着垂直拇指托盘的高度移动。因此，建议我适当的自定义，如果你熟悉的自定义和设置的超大滑块。