溢出：隐藏中断jQuery滑块

我为任何人创建了一个demo.您会注意到它有效,但是尝试添加overflow：hidden到.clickWrapper div来隐藏div滑入并且它会中断.当您单击所需的div时,它将滚动浏览其他div.

http://jsfiddle.net/z67tZ/

$(function() {
    $(".clickIt a").click(function() {
        var linked = $(this).attr("href");
        var pos = $(linked).position();
        $(".clickSlider").stop().animate({
            left: -pos.left,},500);
    });
});

<div id="wrapper">
    <div class="clickIt">
        <a href="#one">one</a>
        <a href="#two">two</a>
        <a href="#three">three</a>
    </div>
    <div class="clickWrapper">
        <div class="clickSlider">
            <div id="one">one</div>
            <div id="two">two</div>
            <div id="three">three</div>
        </div>
    </div>
</div>

#wrapper {margin: 0 auto; width: 200px;  }
.clickWrapper {BACkground:red; position:relative; overflow:hidden; BACkground-color: #CCc; height: 200px; }
.clickSlider { position: relative; width: 600px; }
#one,#two,#three { float: left; width: 200px; }

解决方法

$(".clickIt a").click( function (E) {
    e.preventDefault();
    var linked = $(this).attr("href"),pos = $(linked).position().left;

    $(".clickSlider").stop().animate({left: -pos},500 );
});