11

ウェブサイトのページをスムーズにスライドさせたい。だから私は作った $('a').click(); リンクがローカルかどうかをチェックする関数。リンクがローカルである場合は、リンクの href を取得して body にロードします。

$('a').click(function(){
    var href=$(this).attr('href');  
    $('body').load(href);
    return false;
});

見た目はいいですが、私のサイトには多くの js プラグインも含まれています。それらの実行には時間がかかり、.loadアクションは最初に「js によって変更されていない」コンテンツを表示し、次に js を実行します。コンテンツのちらつきの原因となります。

JS のすべての実行で新しいコンテンツをキャッシュし、それが完了するまで古い本体を変更しないでください。DOM と JS がすべて新しいコンテンツ、slideOut 古いコンテンツ、slideIn 新しいコンテンツで完了したら、それは可能ですか?

編集:ポイントはjsの実行を検出することではなく、すべての追加ファイルがロードされているかどうかを確認することだと思います-DOMの変更は、新しいファイルの $(window).load と同時に起動する必要があります。

[編集] - - - - - - - - - - - - - - - - - - - - - - - - -----------------------

そのための私の解決策は、クロスブラウザーの不透明度が 0 の css コード (css は常に dom がビルドされる前にロードされる) でした。

.transparent{
    -moz-opacity: 0.00;
    opacity: 0.00;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha"(Opacity=0);
    filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);
    filter:alpha(opacity=0);
}

また、通常はコンテンツのちらつきを防ぎますが、常にではありません。コンテンツが jQuery ajax によってロードされたことを何らかの方法で検出し、いくつかの表示タイムアウトなどを適用できるようになりました。しかし実際には、疑問はまだ未解決です。

その質問のもう少し簡単な例を次に示します。

.load('something.php') 関数を起動するリンクをクリックしてから $('body').load('something.php') 3000ms 後に DOM の変更を開始するにはどうすればよいですか? (読み込みはクリック後すぐに開始する必要がありますが、DOM の変更は後で開始する必要があります)

4

3 に答える 3

1

たぶん、promise を使用して、次のようなことを試してみてください。

$('a').click(function(){
    var href=$(this).attr('href');
    $('body').hide();
    $('body').load(href, function() {
      $('body').show();
    });
});
于 2014-12-15T08:32:27.667 に答える