使用带有/之前ID的Pagescroll

时间:2016-06-15 19:56:06

标签: jquery twitter-bootstrap cakephp

我正在使用pagescroll(Bootstrap),当我使用#scroll或#test作为链接时,它工作正常。但是当我使用

<a href="/#experiences" class="page-scroll">Experiences</a>

不会。我想这是因为/,但是我需要它,所以菜单会回来,而不是仅仅添加一个#experiences到另一个链接,如

www.test.de/othersite#experiences

那是我的jQuery。这可以在jQ中修复吗?

$('a.page-scroll').bind('click', function(event) {
    var $anchor = $(this);
    $('html, body').stop().animate({
        scrollTop: ($($anchor.attr('href')).offset().top - 50)
    }, 1250, 'easeInOutExpo');
    event.preventDefault();
});

1 个答案:

答案 0 :(得分:1)

您可以使用.replace()"/#experiences"转为"#experiences"

代码示例:

$('a.page-scroll').bind('click', function(event) {
    var $anchor = $(this);
    $('html, body').stop().animate({
        scrollTop: ($($anchor.attr('href').replace("/", "")).offset().top - 50)
    }, 1250, 'easeInOutExpo');
    event.preventDefault();
});

注意:

如果您要做的是拥有这样的网址: www.test.de/othersite/#experiences 然后这将无法工作,因为\用于在HTTP请求中引用文件的路径,因此无法实现。