jQuery循环分页器scrollTop

时间:2014-09-02 10:05:34

标签: jquery slideshow cycle

我有这个:

<div id="slides">
    <img src="images/1.jpg">
    <img src="images/2.jpg">
    <img src="images/3.jpg">
    <img src="images/4.jpg">
    <img src="images/5.jpg">
</div>

<div id="t-container">
    <ul class="thumbs">
        <li><img src="images/1.jpg"></li>
        <li><img src="images/2.jpg"></li>
        <li><img src="images/3.jpg"></li>
        <li><img src="images/4.jpg"></li>
        <li id="lasty"><img src="images/5.jpg"></li>

    </ul>
</div>

我的javascript代码是:

        $(document).ready(
        function() {
            $('#slides').cycle({
                fx: 'scrollLeft',
                pager: 'ul.thumbs',
                pagerAnchorBuilder: function(index, el) {
                    return '';
                },

                before: function() {
                    if ($('#lasty .activeSlide').length > 0) {
                        $('.thumbs').animate({
                            scrollTop: $('.thumbs').scrollTop() + 100
                        }, 3000);
                    }
                }
            })
        }
    );

我在过去2天内搜索Google,无法找到任何解决方案。

我需要的是为li的最后一个孩子设置动画,以便在获得class=activeSlide时向上滚动动画100px。因为我设置了高度,以便缩略图图像容器不显示最后一张幻灯片,并且它被隐藏。

我需要在最后li得到activeSlide时,它应该向上移动到可见区域,因为它被'overflow:hidden'属性隐藏。

1 个答案:

答案 0 :(得分:0)

我认为你在$('#lasty .activeSlide')

使用了错误的选择器

如果上一个li将获得课程.activeSlide,则选择器应为$('#lasty.activeSlide')

另外使用可以使用.hasClass()来简化逻辑

if($('#lasty').hasClass('activeSlide'))

看看这是否有帮助。