1

少しの AJAX 機能といくつかのアニメーション効果を備えた Web サイトに取り組んでいます。

ユーザーが Web サイトのホームページにアクセスすると、単純なイメージ ローテーターをオンにする関数が呼び出されます。そのバナー ローテーターはホームページにのみ配置されているため、ユーザーが他のページから Web サイトの閲覧を開始した場合に関数を呼び出しても意味がありません。

if (location.pathname.length <= 1) {
animate_hero_images();
}

最初のページが読み込まれ、ユーザーがリンクをクリックしてサイト内のナビゲーションを開始すると、AJAX が起動し、他のすべてのページが、ユーザーが最初にアクセスしたページに読み込まれます。

問題 # 1:ユーザーが最初にホームページではないページにアクセスし、後で AJAX 経由でホームページをロードした場合、animate_hero_images関数が呼び出されません (バナー ローテーターが無効になっています)。

問題＃2：ユーザーが最初にホームページに到着し、次に他のページに移動してから再びホームページに戻った場合、残念ながら私が制御できない特定のサイトに関する多くの特定の問題を処理し、animate_hero_images機能がロードされます著しく遅延し、正常に動作しません。

animate_hero_imagesイベントで関数を再度呼び出すことで、両方の問題を解決しようとしclickました。しかし、それは問題を部分的にしか解決しません。ユーザーが非ホームページから開始してホームページをロードすると、関数が呼び出され、画像回転子が正常に動作します。しかし、ユーザーがホームページから開始し、別の場所に移動してホームページに戻った場合、関数は正常に呼び出され、しばらくして前の呼び出しから同じ関数が開始され、画像が大幅に回転し始めます。より速く、奇妙な不規則なリズムで。

私の解決策は、ホームページの関数を呼び出し、クリックして関数を停止し、新しいページが読み込まれたら、それがホームページの場合は関数を再度呼び出すことです。

このスニペットを使用して機能を無効にします。

$("body").on('click', '.ajax-link a', function(event) { 
animate_hero_images = function() {};
// do all sorts of other stuff
}

どういうわけか、これは機能しません。AJAX 経由でホームページに戻ると、気まぐれな機能がオンになります。

どうすればこの問題を解決できますか?

4

1 に答える 1

1

個人的には、以下ではなく、ヒーロー イメージ コンテナーの存在を確認しlocation.pathnameます。

function animate_homepage() {
    if($('#hero-container-id-here').length > 0)
    {
        // call animation function here
    }
});

...そして、AJAX success() メソッドを介して新しいコンテンツがロードされるたびにそれを呼び出します (それが使用している場合)。アニメーション関数は、ヒーロー画像が実際にページに存在する場合にのみ起動する必要があります。

コンテンツがフェードインする場合、これをタイムアウトにする必要があるかもしれません。現在のソリューションが機能しない理由の 1 つは、ホームページのコンテンツがページに読み込まれる前に発生するクリック イベントで関数を呼び出していることです。

于 2013-06-14T09:35:20.547 に答える