jquery - UI修改为jQuery的scrollTo : Fade Prev/Next controls when nothing left to scroll

Question

http://cambridgeuplighting.com/portfolio

我正在尝试创建一个函数，当幻灯片到达任一端时，该函数将淡出scrollTo 函数的“下一个”和“上一个”控件。我有一个良好的开端，但它并没有按照我想要的方式工作。我需要控件在点击结束之前淡出点击。现在它到达末尾，然后下一次单击(不会滚动，因为它位于末尾)将使控件淡出。

这是我的代码，提前非常感谢!

jQuery(请参阅上面的 HTML 和 CSS 站点链接)

 jQuery(function( $ ){
    var itemSize = $('div.portfolioPost').size();
    var containerWidth = itemSize*240;
    //set the width of the container depending on how many post items are there
    $('#postContainer').css({'width': containerWidth })
    //find the relative position of the end point by getting the negative value of the container width minus 961 (extra pixel is to account for IE difference)
    var endPoint = 0-containerWidth+961;
    $('.olderEvents').click(function () {
        $('.newerEvents').fadeTo(350, 1.0)
        var slidePos = $('#postContainer').position();
        if (slidePos.left<=endPoint) {
            $('.olderEvents').fadeTo(350, 0.1)
        } else {
            $('#slideScreen').scrollTo('+=960', 700 );
        }   
    });

    $('.newerEvents').click(function () {
        $('.olderEvents').fadeTo(350, 1.0)
        var slidePos = $('#postContainer').position();
            //relative position of 0 means the slideshow is at the other end
        if (slidePos.left==0) {
            $('.newerEvents').fadeTo(350, 0.1)
        } else {
            $('#slideScreen').scrollTo('-=960', 700 );
        }
    });
});

Answer 1

我认为所需的功能对于用户来说是不直观的。而不是禁用用户已经在使用的控件；强制他们识别并开始使用另一个控件，我认为将此控件重新映射到用户直观的功能更有用。

在本例中，这将允许用户使用此控件以相反的顺序浏览列表。将此视为尝试为用户提供最有用的工具来浏览您的内容。

这样想:使用/查看/排序一堆书的更好方法是什么？将它们排成一排并要求用户来回移动该行，或者将书籍排列在懒惰的苏珊上并允许用户旋转它？

这里的比喻更多的是让用户将内容视为一条不间断的链条，而不是有末端的字符串，而不是在视觉上表示一个圆或一行。

此处展示了此方法的适当示例: http://www.ndoherty.biz/demos/coda-slider/2.0/