JavaScript_javascriptスキルでウィンドウを操作する方法のまとめ-jsチュートリアル-php.cn

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

WBOY

リリース： 2016-05-16 17:31:01

オリジナル

1067 人が閲覧しました

前の紹介では、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 ページのコードです: 

コピーcode コードは次のとおりです:

ページ adpage.html がロードされると、関数 startAD() が実行されます。画面の幅を計算するには window.screen を使用する必要があるため、ユーザーのブラウザが window.screen オブジェクトをサポートしている場合にのみウィンドウを移動できます。ウィンドウは、画面の上端に沿って、左上隅 (pos=0) から右上隅までスライドします。
組み込みの setInterval() 関数を使用して、広告ウィンドウを 50 ミリ秒ごとに 5 ピクセル移動します。「停止」ボタンをクリックすると以下が実行されます