コンテンツが正常にスムーズに見えるように、ジャーリングなどを制限するために、適切に読み込まれたサイトを表示するためのチュートリアルやプラグインがありますか？例えばjQueryサイト/コンテンツのフェードインがロードされたら？
私はそれだけで特定の領域だった場合は、ヘッダーやフッターはすでに前のページから、キャッシュされるように、それが容易になるだろうとし...
様々なサムネイル付きポートフォリオページ、彼らはのみ表示されます準備ができたらスムーズに。
これはできますか？
div#main-content { display: none; }
はその後、このスクリプトを使用します。
はdiv要素（例えば<div id="main-content">）を使用して、コンテンツをラップし、これを入れて、あなたのCSSには、任意のヘルプ:)
はいいただき、誠にありがとうございます。コンテナはあなたの全体の内容を含むdiv要素のIDです
$(document).ready(function() {
$('#main-content').fadeIn();
});
jQuery(document).ready(function(){
jQuery("#container").fadeIn();
});
。
第1に、ウェブデザイナーは、一般に、ページの読み込み時間を改善してできるだけ早く表示することに多くの時間を費やしています。これは積極的に逆に進んで、すべてが準備が整うまで空白のページを表示しますが、これは理想的ではありません。
しかし、それはあなたの状況に応じて適切だ場合：
目に見えるすべてのものは、あなたがbodyが隠さロードし、その後でそれをフェードインでき、bodyの子孫となりますので、JavaScriptをせずにユーザーのためのフォールバックを含めることが重要であろう（。典型的には少なくとも2％未満、少なくともaccording to Yahoo）。だから、の線に沿って：
<!DOCTYPE html>
<html>
<head>
<title>Example</title>
<!-- This next would probably be in your main CSS file, but shown
inline here just for purposes of the example
-->
<style type="text/css">
body {
/* Hide it for nifty fade-in effect */
display: none;
}
</style>
<!-- Fallback for non-JavaScript people -->
<noscript>
<style type="text/css">
body {
/* Re-displays it by overriding the above */
display: block;
}
</style>
</noscript>
</head>
<body>
...content...
<script src="jquery.js"></script>
<script>
// This version runs the function *immediately*
(function($) {
$(document.body).fadeIn(1000);
})(jQuery);
</script>
</body>
</html>
ことのスクリプト部分のバリエーションのカップル、あなたがフェードインが発生したいときに依存：「準備」の
待ちますイベント：
// This version waits until jQuery's "ready" event
jQuery(function($) {
$(document.body).fadeIn(1000);
});
ワそれwindow#loadイベントのために：
// This version waits until the window#load event
(function($) {
$(window).load(function() {
$(document.body).fadeIn(1000);
});
})(jQuery);
window#load火災後半ページのロードプロセスで非常に、（すべての画像を含む）すべての外部リソースをロードした後。しかし、あなたは、すべてがロードされるまで待つことを望んでいたと言いました。それはあなたがしたいことかもしれません。それは間違いなくあなたのページが遅く見えるようになります...
良い。フォールバックを考える人はごくわずかです。 +1のニースの提案 –
真。しかし、私はまだ身体を置くだろう{display：none; }私はできるだけそのような埋め込みスタイルを回避しようとすると、CSSファイルに。 –
@sushilbharwani：そうです。それは一般に訪問ユーザーの2％以下です（少なくとも、Yahooの番号です）（http://developer.yahoo.com/blogs/ydn/posts/2010/10/how-many-users-have-javascript-disabled/ ））、でもまだ... –
これを達成する別の方法は、Animate.cssプロジェクトです。その純粋なCSSはとてもJSに依存する必要はありません：。
はちょうどあなたの親要素に「アニメーション」と「フェードイン」クラスを追加し、すべての子どもたちがフェードインします
$(document).ready(function() {
$('body').hide().fadeIn('fast');
});
誰かがJavascriptを有効にしていない場合に備えて、これに対するフォールバックはありますか？ – optimus203