需要缩略图拼贴滚动/幻灯片/滑块

时间:2013-06-02 10:35:46

标签: slider slideshow scroller

我正在寻找缩略图平铺滚动条/幻灯片/滑块 以下是http://safari.to/clients示例 真的很感激,如果有人可以帮助:)谢谢

1 个答案:

答案 0 :(得分:0)

当你在任何网站上看到某些东西时,它很容易检查,看看它们是如何做到的。

您提到的网站是使用自己的脚本而不是插件

来完成的

请参阅http://safari.to/assets/js/script.js中的以下代码。您还需要通过检查其CSS代码来了解它们如何为滑块设置样式

// Agencies slide
    var clients = Math.floor(Math.random() * 2) + 1;  // nth-child indices start at 1
    if ( clients == 1){
        $('.agencies.clients').hide();
    }
    else 
    {
        $('.brands.clients').hide();    
    }

    $('.agencies menu a').bind({
        click: function() 
        {
            if(sliding) return false;

            var pointer = $(this);
            var width = $('.agencies .scroller li').length * 137;
            var current = parseInt($('.agencies .scroller').css('left'));
            var distance = 0;

            if(pointer.is('.right-pointer'))
            {
                if(current == -1920) distance = current - 137;
                else distance = current - 960;
                if((width + current) < 960)
                    distance = current;
            }
            else 
            {
                distance = current + 1097;
                if(distance > 0)
                    distance = 0;
            }

            sliding = true;

            $('.scroller').animate({
                left: distance + 'px'
            }, 300,
            function() 
            {
                sliding = false;
            });
        }
    });