无法使用jquery滚动到新页面

时间:2013-09-17 12:29:17

标签: jquery scroll

我使用本地滚动来自http://demos.flesler.com/jquery/scrollTo/

现在我的问题是我必须导航到新的html页面。我尝试使用test.html#section2但它只在本地滚动。你能告诉我我做错了吗

<script>
 $(document).ready(function() {
$('#nav, #footer-nav').onePageNav({
    begin: function() {
    console.log('start')
    },
    end: function() {
    console.log('stop')
    },
    changeHash: true
  });
  });
 </script>

enter image description here

这是我的网站http://www.spheretekk.com/indus/ 如果你进入页脚部分并看到我的屏幕截图,我说我希望它打开一个新页面,然后跳转到指定的ID。

我设法在这里创造一个小提琴吧 http://jsfiddle.net/U8v2y/

1 个答案:

答案 0 :(得分:1)

您可以使用javascript函数滚动

在文档就绪函数中,通过

获取元素id
$(document).ready(function() {
   var hash = window.location.hash;
   scrollme(hash);
);

将这些功能添加到脚本

function scrollme(id)
{
     var scrollElem = scrollableElement('html', 'body');
     var targetOffset = $(id).offset().top;
      $(scrollElem).animate({scrollTop: targetOffset-100}, 1000, function() {

          });
}
function scrollableElement(els)
{
    for (var i = 0, argLength = arguments.length; i <argLength; i++) {
      var el = arguments[i],
          $scrollElement = $(el);
      if ($scrollElement.scrollTop()> 0) {
        return el;
      } else {
        $scrollElement.scrollTop(1);
        var isScrollable = $scrollElement.scrollTop()> 0;
        $scrollElement.scrollTop(0);
        if (isScrollable) {
          return el;
        }
      }
    }
    return [];
}