2

IEは私のまろやかさを厳しくしています...

jqueryが表示するまで、ページのjqueryで制御されたコンテンツを表示したくありません。ただし、Internet Explorer 7および8では、jqueryが引き継ぐ前にコンテンツが点滅して表示されます。$（window）.load関数と$（document）.ready関数を試しましたが、それでも同じ問題が発生します。

具体的には、Cufonがテキストを表示するまでテキストを表示したくないし、曲線の角が角を丸めるまでページ#fieldを表示したくない。また、jqueryサイクルのスライドショーがあり、スライドショーのすべてのコンテンツが一度に短時間表示されます。

1つの解決策は、私は特に熱心ではありませんが、次の方法でダーンページ全体を非常に高速にフェードインさせることです。

$(window).load(function(){$("#field").fadeIn(0);});

時間が0msに設定されていても、これはjqueryが表示するまですべての非表示コンテンツを非表示のままにするために機能します。ただし、欠点は、ページ間を移動するときにページが点滅することです。（私は期間で遊んでいますが、IEを使用すると、ページが空白になるだけです。jqueryを使用してIEでフェードインするものを取得することはできませんでした）。

最も複雑なページは次のとおりです。http：//ianmartinphotography.com/test-site/testimonials/index.htmlトップディレクトリのメイン（ホーム）インデックスページが稼働していますが、他の作業も行っています。 ... ありがとう！

4

7 に答える 7

1

利用できる手法の1つは、ドキュメントの<head>に以下を追加することです。

<script>
document.documentElement.className = "js";
</script>

次に、CSSを使用して、JavaScriptで要素を表示する前に、要素が完全に非表示になっていることを確認できます。

.js .some-element {display: none;}

何らかの理由でJavaScriptが機能しない場合も、これは正常に低下します。

于 2011-02-10T19:16:55.773 に答える
1 
<html lang="en" class="hideshow">

また

<html lang="en" style="display:none">

インラインスタイル「display：none」またはcssファイルのいずれかでnoneを表示するように設定します

質問タグにjqueryが含まれているので、jqueryを使用していると思います。もしそうなら、あなたはこれをあなたのドキュメントレディ機能に入れることができます

$(function(){
$('.hideshow').fadeIn("slow").show();
});

または2番目の使用のため。

$(function(){
$('html').fadeIn("slow").show();
});

http://jsfiddle.net/NtCKn/でチェックしてください

于 2011-02-10T19:41:56.507 に答える
0

問題の要素をdisplay：noneでスタイル設定することは可能でしょうか。または可視性：非表示; CSSを使用し、ページが読み込まれるときにjQueryを使用してこれらの要素を表示しますか？

于 2011-02-10T19:16:17.010 に答える
0

条件付きコメントを試してください：

<!--[if IE]>
  <style>
    body {
     display: none;
    }
  </style>
<![endif]-->

そしてonload、スクリプトを通してこれを削除します：

<script>
  $(window).load(function(){$('body').css('display:block');});
</script>

ブラウザがIEでJSがオフ（プログレッシブエンハンスメントが良い）のときに機能が必要な場合、最初のコードブロックは少し複雑になります。

<head>
<!--[if IE]>
  <style>
    body {
     display: none;
    }
  </style>
  <noscript>
    <style>
     body {
       display: block !important;
     }
    </style>
  </noscript>
<![endif]-->

これは本体を非表示にしますが、JSがオンの場合のみです（styleJSがオフの場合、2番目のブロックが最初のブロックをオーバーライドするため）。

于 2011-02-10T19:17:45.313 に答える
0

設定CSSスタイルの表示：なし。Bodyまたはラッパー要素に適切に機能します。ディスプレイで非表示にすると、常にうまくレンダリングされないものがあることに注意してください。そのような場合、可視性を使用する必要があるかもしれません。次に、要素を可視性で見えるようにします。フェードイン（）はそのためには機能しませんが、回避策は.hide（）->可視性：表示され、ドキュメントの準備ができたら.fadeIn（）になります:)

于 2011-02-10T19:44:41.893 に答える
0

だから、私は今までやってきたこと、質問で述べたことをやっているだけです。ページをjQueryでフェードインさせるだけで、JavaScript駆動のものを表示する前にIEがその動作をまとめるのにほんの一瞬しかかかりません。私は使用しています：

$(window).load(function(){$("THE DIV CONTAINING MY PAGE").fadeIn(0);});

...そしてこれからもそうしていきます。@alexは、すべてのhtmlをフェードインさせるという解決策を彼の回答に提供しました。それも機能する可能性があります（問題のページで具体的にテストしていませんが、彼の方法ですべてが行われるため、よりローカライズされたフェードインを好みます。背景色を含めてフェードインします。別のサイトでは本当にクールであることがわかりましたが、このサイトではその外観は私には適切ではありません...）

@Marc Bは、私の質問の下のコメントで非常にエレガントな解決策を提案しました。私は彼に答えとしてそれを言い直すように勧めました、そしてそれがうまくいくなら（そしてそれまでの間誰もより良い考えを提供しません）、私は彼をグリーンチェックします。（私はそれがうまくいくと思っています-次に私の窓のマシンの前にいるときにそれを試してみます...）

他に何かアイデアがあれば、ぜひ見てみたいです！

于 2011-02-13T18:07:16.873 に答える
0

@MarcBはこれを称賛するに値します。私は3日間待ったので、彼は自分のバージョンの回答を投稿して、グリーンチェックを行うことができました。

最終的なテスト済みのコードは次のとおりです。

<script type="text/javascript">
 $(document).ready(function(){
 $("THE DIV CONTAINING MY PAGE").css('display', 'block');
 });
</script>

非常にシンプルで効果的です。

于 2011-02-17T01:31:55.863 に答える