Question

我想使用ScrollTo插件滚动到已单击的元素。因此，单击的元素最终位于页面顶部。我有以下代码：

scripts.js中

$(document).ready(function(){
    $("#post").hover(
        function(){
            $("#sbox").toggle("slow");
        },
        function(){
            $("#sbox").toggle("slow");
        });
        $(".jumbotron").click(function(){
            jQuery(this).ScrollTo();
        });

});

这会引发错误：

[Error] TypeError: 'undefined' is not a function (evaluating 'jQuery(this).ScrollTo()')
    (anonymous function) (scripts.js, line 10)
    dispatch (jquery-1.11.1.js, line 4641)
    handle (jquery-1.11.1.js, line 4309)

我该怎么做？

Answer 1

这种情况发生的原因是，当您想要将窗口滚动到元素（或iframe内部的iframe）时，您试图滚动元素本身。

documentation指定，在滚动整个窗口的情况下，我们可以按如下方式使用它滚动：

$.scrollTo(position, transitionSpeed,{...});

为我们留下最后结果的一些变化：

$(".jumbotron").click(function(){
   $.scrollTo($(this).position().top, 500); //gets top position of element
});

考虑到定位的需要，这是一个例子

我已经设置了一个小提琴＆gt;＆gt; http://jsfiddle.net/3M5fE/使用工作示例，蓝色div是滚动的。

Answer 2

该插件名为scrollTo，小写“s”。

试试这个

$(document).ready(function(){
    $("#post").hover(
        function(){
            $("#sbox").toggle("slow");
        },
        function(){
            $("#sbox").toggle("slow");
        });
        $(".jumbotron").click(function(){
            $.scrollTo(this);
        });
});

根据具体情况，更改show（）或hide（）的toggle（）会更安全。

使用ScrollTo插件滚动到单击的元素

2 个答案: