0

我不确定这是一个错误还是编写它的方式，但任何帮助都很棒！

我正在使用 Ben Alman 的 jQuery hashchange 事件，我在其他项目中使用过

hashevents 使用淡入淡出动画并且没有问题。有了这个文件，我有一页

网站并使用 scrollTop 功能。后退按钮有效，但仅有效一次，并且

前进按钮根本不起作用，然后它来回跳跃但没有动画。下边是

我目前拥有的。

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>

查询：

    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');
4

1 回答 1

0 
$(document).ready(function(){
var href         = '';
var easeDuration = 1000;
var easeType     = "easeOutExpo";
$(window).hashchange(function(){
//your code
});
});
于 2012-08-18T06:59:47.173 回答