0

アイテムがクリックされたらアニメーション化するナビゲーションバーがあります。ナビゲーションが完了したら、リンクをたどりたいと思います。

HTML：

<div id="project-nav">
    <ul> 
        <a href="" >
            <li class="project-3">1
                <ul> 
                    <li>WAIKANAE BEACH HOUSE</li>
                </ul>
            </li>
        </a>

        <a href="">
            <li class="project-4">2
                <ul> 
                    <li>WAITAHEKE WETLAND HOME</li>
                </ul>
            </li>
        </a>

        <a href="">
            <li class="project-1">3
                <ul> 
                    <li>WAIKANAE BEACH HOUSE</li>
                </ul>
            </li>
        </a>

脚本：

$("#project-nav a").click(function(ev) 
{
    ev.preventDefault();

    var $self=$(this);

    $(".project-1").animate( {"top": "+=-500px"}, 1200, function() { showComplete() } );
    $(".project-2").animate( {"top": "+=-500px"}, 1400, function() { showComplete() } );
    $(".project-3").animate( {"top": "+=-500px"}, 1000, function() { showComplete() } );
    $(".project-4").animate( {"top": "+=-500px"}, 1000, function() { showComplete() } );
    $(".project-5").animate( {"top": "+=-500px"}, 1000, function() { showComplete() } );
});

function showComplete()
{
    document.location = $self.attr('href');
}

これが私がこれまでに持っているものです。アニメーションは機能しますが、リンクをたどりません。

4

3 に答える 3

0

問題は$self、の範囲外で宣言されていますshowComplete。

代わりにこれを試してください：

$("#project-nav a").click(function(ev) {

    ev.preventDefault();
    var $self=$(this);

    $(".project-1").animate( {"top": "+=-500px"}, 1200, showComplete);
    $(".project-2").animate( {"top": "+=-500px"}, 1400, showComplete);
    $(".project-3").animate( {"top": "+=-500px"}, 1000, showComplete);
    $(".project-4").animate( {"top": "+=-500px"}, 1000, showComplete);
    $(".project-5").animate( {"top": "+=-500px"}, 1000, showComplete);

    function showComplete(){
        window.location = $self.attr('href');
    }
});

私がしたことはshowComplete、イベントハンドラー内に移動することでした。

于 2013-02-24T23:29:50.580 に答える
0

$selfはの範囲外ですshowComplete()。

代わりにパラメータを渡す必要があります。

例

$(".project-5").animate( {"top": "+=-500px"}, 1000, function() { showComplete($self.attr("href")) } );

function showComplete(pUrl){
    document.location = pUrl;
}
于 2013-02-24T23:30:55.687 に答える
0

私の推測は$self未定義です。作成された関数にのみ存在します。

あなたがする必要があります：showComplete（$ self）;

次に、関数の作成で：

showComplete(el){
    document.location = el.attr('href');
}
于 2013-02-24T23:30:58.647 に答える