这个问题可能特定于我正在使用的东西,因为代码似乎广泛可用。我正在使用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>