1

コンテンツを動的に変更する単一ページの上に基づく Web サイトがあります。コンテンツのコンテナーは、いくつかの javascript と css アニメーションを含む div であり (ナビゲーションに「アニメーション化された」クラスを指定しました)、このクラスを削除したい (したがって、アニメーション化されなくなります)。

このクラスを削除 (最初のページの読み込み後) または追加 (最初のページの読み込み中) する方法はありますか? 既に標準のクエリ コードを試しましたが、div コンテナーのコンテンツを変更するリンクをクリックすると、アニメーションがすべて再開されます。これが私のhtmlです：

<nav class="main animated fadeInRight"><?php include('template/nav/main.php'); ?></nav>

そのようなものでアニメーション化されたクラスを削除したいと思いますが、新しいページが読み込まれるたびに。

<script type="text/javascript">
    $(document).ready(function() {
        $('nav').removeClass("animated");
    });
</script>

リンクをクリックしてコンテンツを変更すると、ページがリロードされ、すべてのアニメーションが再び開始されるため、これは機能しません。

どうもありがとう！

4

6 に答える 6

1

すべてのコードを見ずに判断するのは難しいですが、ナビゲーション リンクの最後に URL パラメーターを配置することになるでしょう。リンクをクリックしてコンテンツを変更すると、ページもリロードされるとおっしゃいましたね。

さて、あなたのナビのすべてのリンクに、次のようなパラメータを入れてください：

<a href="pageName.php?firstLoad=N">Page Name</a>

次に、ナビゲーションを含むすべてのページの上部に:

<?php 
    if($_GET["firstLoad"] == "N") {  
        echo '<nav class="main fadeInRight">';
        include('template/nav/main.php');
        echo '</nav>';
    } 
    else {
        echo '<nav class="main animated fadeInRight">';
        include('template/nav/main.php');
        echo '</nav>';
    }
?>
于 2013-10-30T15:07:28.023 に答える
0

ページをリロードするたびに、アプリがまったく新しく開始されます。

ページの更新後にアニメーションが表示されないようにしたい場合は、

文字列にパラメーターを追加できます-つまり、 /?animation=true

PHPファイル内でそれを探します

<nav class="main <?php if($_GET['animation'] == true) {echo animated." ";} ?> fadeInRight"><?php include('template/nav/main.php'); ?></nav>

次に、他のすべてのリンクから削除します。

私が正しく理解していない場合を除き、その場合は、提供されたスクリプトのタイプミスを修正してください。

$().ready(function() {
    $("nav").removeClass("animated");
});
于 2013-10-30T14:56:48.737 に答える
0

ウェブストレージを利用できます。

ページが最初に読み込まれるときに、nav からクラスを削除し、後でクラスを既に削除したかどうかを確認します。

ページが読み込まれると、次のようなことができます。

<script>
    if(localStorage.getItem("ClassRemoved") !== "true") {
         // remove the class
         localStorage.setItem("ClassRemoved", "true");
    }
</script>
于 2013-10-30T14:57:21.657 に答える
0

いくつかの「」がありません

<script type="text/javascript">
    $(document).ready(function() {
        $('nav').removeClass("animated");
    });
</script>

または正確な

<script type="text/javascript">
    $(document).ready(function() {
        $('nav[class="main"]').removeClass("animated");
    });
</script>
于 2013-10-30T14:53:45.563 に答える
0

次のように、nav を引用符で囲む必要があります。

$("ナビゲーション")

それ以外の場合、存在しない変数を指しています

于 2013-10-30T14:53:53.710 に答える
0

これは可能性に開かれているため、多くの解決策があります。しかし、このリンクはおそらくクッキーの作成に役立ち、その寿命に基づいて、アニメーション化するかどうかを決めることができます.

于 2013-10-30T15:11:49.123 に答える