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'));
    }

2つの問題：

  • 左に移動するつもりだったとしても、最初liをの最後に移動しました。ul
  • あなたのアニメーションと絶対位置が間違っていました。
于 2013-03-25T11:56:39.913 に答える