有平滑滚动到锚点链接的问题

时间:2013-02-05 21:16:56

标签: jquery smooth-scrolling

这个问题可能特定于我正在使用的东西,因为代码似乎广泛可用。我正在使用Wordpress(应该已经将jquery入队)。有人知道这里有什么简单的东西吗?

http://antiquewoodrestoration.com(这使用Wordpress,以及Twitter Bootstrap)

这是我的javascript(目前位于/ body之前的页脚)

<script type="text/javascript">
jQuery(document).ready(function($) {
  $(".scroll").click(function(event){   
    event.preventDefault();
    $('html,body').animate({scrollTop:$(this.hash).offset().top}, 500);
  });
});
</script>

应触发此操作的html只是一个锚链接,例如http://antiquewoodrestoration.com/#servicearea

链接全部工作(它们是页面顶部的导航);他们只是不顺利。我对javascript不好,但我觉得我在这里错过了一个真正的基础。这是其中一个锚ID的html:

<div id="servicearea">

...

</div>

哇!刚刚得到它。这是我正在使用的代码。仍然会感激任何反馈,因为我不知道为什么现在这样做...

<script type="text/javascript">
  jQuery(function($) {
    // from http://imakewebthings.com/jquery-waypoints/

    // Wicked credit to
  // http://www.zachstronaut.com/posts/2009/01/18/jquery-smooth-scroll-bugs.html
  var scrollElement = 'html, body';
 $('html, body').each(function () {
  var initScrollTop = $(this).attr('scrollTop');
  $(this).attr('scrollTop', initScrollTop + 1);
   if ($(this).attr('scrollTop') == initScrollTop + 1) {
  scrollElement = this.nodeName.toLowerCase();
  $(this).attr('scrollTop', initScrollTop);
  return false;
    }    
   });

  // Smooth scrolling for internal links
  $("a[href^='#']").click(function(event) {
  event.preventDefault();

var $this = $(this),
target = this.hash,
$target = $(target);

$(scrollElement).stop().animate({
  'scrollTop': $target.offset().top
}, 500, 'swing', function() {
  window.location.hash = target;
});

});

});
  </script>

0 个答案:

没有答案