Question

我正在使用jquery.scrollTo.js滚动到一个页面中的块。

Html代码：

<ul>
<li><a href="#about" class="panel">About</a></li>
<li><a href="#product" class="panel">Products</a></li>
</ul>
<div id="about" class="item">
<a name="about"></a>
About content
</div>
<div id="product" class="item">
<a name="product"></a>
Products content
</div>

内部脚本：

<script>
$(document).ready(function() {
$('a.panel').click(function () {

$('a.panel').removeClass('selected');
$(this).addClass('selected');
current = $(this);
$('#wrapper').scrollTo($(this).attr('href'), 800);      
return false;
});
});
</script>

请参阅http://jsfiddle.net/8up4A/以查看jquery.scrollTo.js中的代码。我正在尝试显示ID名称以及http://www.test.com/index.html#about等网址。

如果我删除了在内部脚本中返回false，则id显示在url中但滚动无法正常工作。如何在不影响滚动效果的情况下实现此目的。任何帮助？感谢。

Answer 1

$(document).ready(function() {
    $('a.panel').click(function() {

        $('a.panel').removeClass('selected');
        $(this).addClass('selected');

        var currentString = $(this).attr('href');
        var newString = currentString.substr(1);

        $("html,body").animate({
             scrollTop: $('a[name="'+newString+'"]').offset().top
         }, 2000);

    });
});

你可以删除scrollTo.js插件，你不需要它。

滚动到功能在URL javascript中显示#id

1 个答案: