Question

我有这个div：＆＃34; id1＆＃34;我想滑到这个＆＃34; id2＆＃34;

<div id="id1">上有一个按钮：

<a href="#id2">next</a>

我有这个脚本：

$(function() {
    $('#next-button2').bind('click',function(event){
        var $anchor = $(this);

        $('html, body').stop().animate({
            scrollLeft: $($anchor.attr('href')).offset().left
        }, 2000);

        event.preventDefault();
    });
});

我从this Site拿走了，但它没有用，有什么想法吗？

Answer 1

您的脚本希望将动画功能绑定到ID = next-button2

的DOM对象

将您的HTML更改为：

<a id="next-button2" href="#id2">next</a>

这样你的JQuery就可以将click函数绑定到正确的DOM对象。

此外，您需要将实际动画绑定到正确的对象，因此请更改：

$('html, body')

为：

$('#id1')

如果您想要更深入的答案，您可能需要提供更多HTML，JS / JQ和CSS来查看。

Answer 2

它对我有用：

http://jsfiddle.net/hA9Sp/1/

我认为您在链接中缺少ID“next-button2”。我没有编辑任何javascript。

我的测试HTML：

<div style="position:relative;height:100px;width:2000px;background-color:yellow;">
    <div id="id1" style="position:absolute;left:0px;">
        <a id="next-button2" href="#id2">next</a>
    </div>
    <div id="id2" style="position:absolute;right:0px;">
        id2
    </div>
</div>

如果之后它仍然无效，请确保您的javascript确实运行。添加alert("test");或console.log("test);，看看是否有任何问题。

动画 - ＆gt;向左滑动不工作jQuery

2 个答案: