2

我正在为我的页面使用此代码: http ://askmike.org/2011/12/smooth-page-transitions-using-jquery-video/。

以下是我修改后的 Javascript 代码:

$(function() {
    var request = window.location.hash;
    if(request == '#page-2') {
        $('.page.current').removeClass('current');
        $('.page').eq(1).addClass('current');
    }
        if(request == '#page-3') {
        $('.page.current').removeClass('current');
        $('.page').eq(2).addClass('current');
    }
        if(request == '#page-4') {
        $('.page.current').removeClass('current');
        $('.page').eq(3).addClass('current');
    }
    $('nav a').click(function(){
        var speed = 200;
        var i = $(this).index();
        $('.page.current').animate({opacity: 0, marginTop:0},speed,function(){
            $(this).removeClass('current');
            $('.page').eq(i).css('marginTop',30).animate({opacity:1,marginTop: 0},speed).addClass('current');
        });
    });
});

每当我将链接放在无序列表中时,它就不再知道要显示哪个 div。我不是 Javascript 方面的专家,因为我只是在借用代码,但我猜测将它放在列表中会阻止代码知道哪个是它的顺序(如果这有意义的话)。任何帮助将非常感激。这是一个 jsFiddle:http: //jsfiddle.net/YUH6s/1/ 谢谢。

4

1 回答 1

1

在你的锚链接的标记索引中0,你的eq方法只选择第一个.page元素。您可以找到父 li 元素的索引。

改变:

$(this).index()

到:

$(this).parent().index()

http://jsfiddle.net/Xht3v/

于 2012-09-15T22:37:15.433 回答