私はここが初めてで、JavaScriptも初めてです。
基本的に私が達成しようとしているのは、フッターからページの中央まで画像を上昇させることです.CSSでそれを行う方法を考え出しました. しかし、ページが自動的に読み込まれると、それが立ち上がるようにしたかったのです。
誰かが私を正しい方向に向けたり、いくつかの例を見せてくれたりしたら、とても感謝しています。
前もって感謝します、
ジョー
私はここが初めてで、JavaScriptも初めてです。
基本的に私が達成しようとしているのは、フッターからページの中央まで画像を上昇させることです.CSSでそれを行う方法を考え出しました. しかし、ページが自動的に読み込まれると、それが立ち上がるようにしたかったのです。
誰かが私を正しい方向に向けたり、いくつかの例を見せてくれたりしたら、とても感謝しています。
前もって感謝します、
ジョー
ページの読み込み前/読み込み中にアニメーションを実行したいですか? 最新のブラウザーのほとんどは、何かをアニメーション化する前に Web サイトを読み込みます。
ただし、代替手段があります。もちろん、アニメーションを除いて、ほとんどのコンテンツをページから除外できます。Web サイトが読み込まれると、アニメーションが開始され、AJAX を使用してコンテンツを取得できます。
これは、アニメーションの実行中にコンテンツが読み込まれることを意味します。
ただいまデモを作成中…ちょっと待って!
デモは次のとおりです。http://jsfiddle.net/gWhtQ/
window.addEventListener('load', init, false);
ページがロードされるまでJavaScriptが実行されるのを待っていました。
読み込まれた後XMLHttpRequest
、ページが正常に実行されている間に別のファイルを取得するオブジェクトが作成されます。
コンテンツが読み込まれたら、 を使用して応答を追加しdocument.getElementById('content').innerHTML = xmlhttp.responseText;
ます。
内容は言わずもがな。利用可能なランダムなCSSファイルを使用しました。
Javascript を使い始めたばかりの場合は、 jQueryなどのライブラリを使用してアニメーションを始める方がはるかに簡単になるでしょう。
jQuery を使用すると、ブラウザーの違いや準備完了イベントなどについてあまり心配することなく、やろうとしていることに集中できます。また、jQuery がどのようにアニメーションを実行しているかに興味がある場合は、GitHub のコードを確認してください。
jQueryとAddy Osmani の投稿をチェックすることをお勧めします。ページの読み込み中にアニメーションを実行するには、HTML 本文の上部に画像を配置して、ブラウザーが停止し、ページの残りの部分よりも先に画像を読み込むようにする必要があります。次に、スクリプトで要素がDOMに存在するかどうかをテストし、存在する場合にアニメーションを開始できます。ただし、これは実際にパフォーマンスを妨げます。jQueryを使用して簡単にテストできるページの読み込み後にアニメーションを実行することをお勧めします。このようにして、画像を HTML 本文の任意の場所に配置し、スクリプトを最後に配置して読み込み時間を短縮できます。ポール アイリッシュも、アニメーションの作成に関する優れた投稿をしています。