我不确定这是一个错误还是编写它的方式,但任何帮助都很棒!!
我正在使用Ben Alman的jQuery hashchange事件,我在其他项目中使用了
使用fadeto动画进行操作并且没有任何问题。有了这个文件,我有一页
站点并使用scrollTop函数。后退按钮可以工作,但它只能工作一次
foward按钮根本不起作用,然后它来回跳跃但不动画。下面是
我现在拥有的东西。
CSS:
<nav id="primary">
<ul>
<li>
<a href="#home">home</a>
</li>
<li>
<a href="#about">about</a>
</li>
<li>
<a href="#services">services</a>
</li>
<li>
<a href="#contact">contact</a>
</li>
</ul>
</nav>
<div id="content">
<article id="home">home</article>
<article id="about">about</article>
<article id="services">services</article>
<article id="contact">contact</article>
</div>
JQUERY:
var href = '';
var easeDuration = 1000;
var easeType = "easeOutExpo";
//Thumbanil click states/////
$('#primary ul').delegate('li', 'click', function (e) {
e.preventDefault();
var index = $(this).prevAll().length;
href = $('#primary ul li a:eq(' + index + ')').attr('href');
$('html, body').animate({scrollTop: $(href).offset().top},{easing: easeType,duration: easeDuration,complete: function() {
window.location.hash = href;
return false;
}});
});
$(window).bind('hashchange', function(e){
e.preventDefault();
var newHash = window.location.hash.substring(1);
$('html, body').animate({scrollTop: $("#"+newHash).offset().top}, {easing: easeType,duration: easeDuration,complete: function() {
return false;}});
});
$(window).trigger('hashchange');
答案 0 :(得分:0)
$(document).ready(function(){
var href = '';
var easeDuration = 1000;
var easeType = "easeOutExpo";
$(window).hashchange(function(){
//your code
});
});