ホームページ  >  記事  >  ウェブフロントエンド  >  JavaScript_javascriptスキルでウィンドウを操作する方法のまとめ

JavaScript_javascriptスキルでウィンドウを操作する方法のまとめ

WBOY
WBOYオリジナル
2016-05-16 17:31:011057ブラウズ

前の紹介では、close() メソッドについて説明しました。

コードをコピーします コードは次のとおりです:

win = window.open("http://www.jb51.net/", "js");

JavaScript が提供するウィンドウを制御するために使用できるメソッドとプロパティが多数あります。
移動、スクロール、サイズ変更
次のメソッド (N4、IE4) は、特定のウィンドウの移動、スクロール、サイズ変更操作を担当します。

コードをコピー コードは次のとおりです:
// ウィンドウの画面位置を指定されたオフセット x、y に移動します (絶対移動)
window.moveTo (iX, iY )
// ウィンドウの画面位置を指定されたオフセット x, y に移動します (相対移動)
window.moveBy(iX, iY)
// ウィンドウの画面位置を移動します指定されたオフセット x 、 y までウィンドウをスクロールします (絶対スクロール)
window.scrollTo (iX, iY)
// 指定されたオフセット x 、 y までウィンドウの画面位置をスクロールします (相対スクロール)
window.scrollBy (iX, iY)
// ウィンドウ サイズを指定された高さと幅に変更します (絶対サイズ変更)
window.resizeTo(iWidth, iHeight)
// ウィンドウ サイズを指定した高さと幅に変更します指定された高さと幅 (相対的なサイズ変更)
Window.resizeBy (iX, iY)

これらのメソッドはすべて window オブジェクトに属しているため、現在のウィンドウでインテリジェントに実行されることに注意してください。参照できる他のウィンドウ。ウィンドウの位置とサイズを動的に設定する場合は、ウィンドウの作成後に移動メソッドとサイズ変更メソッドを使用できます。
//form
他のサーバーからのページを含むウィンドウを制御することはできないことに注意してください。
ウィンドウを最大化する
クリックするとウィンドウを最大化できるボタンの作り方を紹介します。
このボタンの HTML と JavaScript コードを見てみましょう:

コードをコピーします コードは次のとおりです。

>

sizeTo() メソッドはウィンドウ全体のサイズを参照することに注意してください。 //form
フローティング広告
ウェブサイトでは、広告ウィンドウを移動させることで閲覧者の注意を引くことができます。次の関数を呼び出すことで、ウィンドウを左右に移動する効果を実現できます:


function makeAd() {
window.open("adpage.html", "ad", "width=468,innerWidth=468,height=80,innerHeight=80,left =0,top=0 ");
}


以下は adpage.html ページのコードです:





ページ adpage.html がロードされると、関数 startAD() が実行されます。画面の幅を計算するには window.screen を使用する必要があるため、ユーザーのブラウザが window.screen オブジェクトをサポートしている場合にのみウィンドウを移動できます。ウィンドウは、画面の上端に沿って、左上隅 (pos=0) から右上隅までスライドします。
組み込みの setInterval() 関数を使用して、広告ウィンドウを 50 ミリ秒ごとに 5 ピクセル移動します。 「停止」ボタンをクリックすると以下が実行されます
声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
前の記事:JavaScript の変数スコープ、値転送、アドレス転送の簡単な紹介と例 基礎_JavaScript スキル次の記事:JavaScript の変数スコープ、値転送、アドレス転送の簡単な紹介と例 基礎_JavaScript スキル

関連記事

続きを見る