1

我在制作滑块时遇到了麻烦,当你按下右手箭头时它工作正常,但是当我按下左手按钮时,它完全弄乱了脚本。

我想知道是否有人可以查看我的代码,看看是否有任何明显的问题。因为我从另一个站点获取了代码,所以它可以正常工作。

我这里有一个链接:

http://emopreview.co.uk/STIHL/12113081/video.html

而 Jquery 是:

$(document).ready(function() {
var nav = $('#wrapper .slider').css('overflow', 'hidden').children('ul'),
sliding = false,
ul = $('#wrapper .slider ul'),
count = $('#wrapper .slider ul li').length,
width = count * 178;    

$('#wrapper .slider ul').width(width);

    function slideLeft() {
        if(sliding){
            return false;
        }
        sliding = true;
        ul.animate({
            left: '0'
        }, 1000, function(){
            sliding = false;
        });
    }
    function moveLeft() {
        $('#wrapper .slider ul li:first').insertBefore($('#wrapper .slider ul li:last'));
        ul.css("left", "-178px");
    }

    function slideRight() {
        if(sliding){
            return false;
        }
        sliding = true;
        ul.animate({
            left: '-=178'
        }, 1000, function() {
            sliding = false;

            $('#wrapper .slider ul li:first').appendTo(ul);
            ul.css("left", "0");
        });
    }
    var autoSlide;
    autoSlide = setInterval(function() {
        slideRight();
    }, 3000);

    $('#wrapper .slider_container').mouseenter(function() {
        clearInterval(autoSlide);
    }).mouseleave(function() {
        autoSlide = setInterval(function() {
            slideRight();
        }, 3000);
    });
    $('#slider-nav').show();

    $('#slider-nav .right_arrow').click(slideRight);

    $('#slider-nav .left_arrow').click(function() {
        moveLeft();
        slideLeft();
    });
 });

谢谢

4

1 回答 1

0

像这样更改您的代码:

    function slideLeft() {
        if(sliding){
            return false;
        }
        sliding = true;
        ul.animate({
            left: ''
        }, 1000, function(){
            sliding = false;
            ul.css("left","0px");
        });
    }
    function moveLeft() {
        ul.css("left", "-178px");           
        $('#wrapper .slider ul li:last').insertBefore($('#wrapper .slider ul li:first'));
    }

两个问题

  • 即使您打算向左移动,您也将第一个移动li到了 的末尾。ul
  • 你的动画和绝对定位是错误的。
于 2013-03-25T11:56:39.913 回答