JavaScript操縱窗口的方法小結(jié)
更新時(shí)間:2013年06月28日 15:42:33 作者:
一旦你得到了表示窗口的變量,你就能通過各種方法來(lái)操縱它。下面介紹一下對(duì)窗口的各種操作
在前面的介紹中,我們討論過close()方法:
復(fù)制代碼 代碼如下:
win = window.open("http://www.dbjr.com.cn/", "js");
win.close();
JavaScript提供了許多方法與屬性,我們可以使用它們來(lái)控制窗口。
移動(dòng)、滾動(dòng)、改變大小
下面的方法(N4+,IE4+)負(fù)責(zé)個(gè)定窗口的移動(dòng)、滾動(dòng)以及大小改變操作:
復(fù)制代碼 代碼如下:
// 移動(dòng)窗口的屏幕位置到指定的偏移x 、y(絕對(duì)移動(dòng))
window.moveTo(iX, iY)
// 移動(dòng)窗口的屏幕位置到指定的偏移x 、y(相對(duì)移動(dòng))
window.moveBy(iX, iY)
// 滾動(dòng)窗口的屏幕位置到指定的偏移x 、y(絕對(duì)滾動(dòng))
window.scrollTo(iX, iY)
// 滾動(dòng)窗口的屏幕位置到指定的偏移x 、y(相對(duì)滾動(dòng))
window.scrollBy(iX, iY)
// 改變窗口大小到指定的高度與寬度(絕對(duì)改變大?。?BR> window.resizeTo(iWidth, iHeight)
// 改變窗口大小到指定的高度與寬度(相對(duì)改變大?。?BR> window.resizeBy(iX, iY)
注意,這些方法都屬于window對(duì)象,所以它們智能在當(dāng)前窗口或者其他可以引用的窗口被執(zhí)行。如果你想動(dòng)態(tài)設(shè)置窗口的位置和尺寸,就可以在窗口創(chuàng)建后使用move和resize方法。
//form
注意,控制一個(gè)包含其他服務(wù)器頁(yè)面的窗口是不可能的。
最大化窗口
我們現(xiàn)在來(lái)介紹如何制作一個(gè)點(diǎn)擊后可最大化窗口的按鈕。
下面看看有關(guān)這個(gè)按鈕的HTML和JavaScript代碼:
復(fù)制代碼 代碼如下:
<SCRIPT LANGUAGE="JavaScript">
<!--
function maximizeWin() {
if (window.screen) {
var aw = screen.availWidth;
var ah = screen.availHeight;
window.moveTo(0, 0);
window.resizeTo(aw, ah);
}
}
// -->
</SCRIPT>
<FORM><INPUT TYPE="button" VALUE="Maximize" onClick="maximizeWin()"></FORM>
注意,resizeTo()方法引用整個(gè)窗口的尺寸。 //form
一個(gè)懸浮的廣告
在網(wǎng)站上,通過移動(dòng)廣告窗口,能夠吸引瀏覽者的注意力。我們可以通過調(diào)用下面的函數(shù)來(lái)實(shí)現(xiàn)讓窗口左右移動(dòng)的效果:
復(fù)制代碼 代碼如下:
function makeAd() {
window.open("adpage.html", "ad", "width=468,innerWidth=468,height=80,innerHeight=80,left=0,top=0");
}
下面是頁(yè)面adpage.html的代碼:
復(fù)制代碼 代碼如下:
<SCRIPT LANGUAGE="JavaScript">
<!--
function startAd() {
if (window.screen) {
pos = 0;
aw = screen.availWidth;
window.moveTo(pos, 0);
timerID = setInterval("moveAd()", 50);
}
}
function moveAd() {
if (pos <= 0) inc = 5;
// 5 - so it doesn't pass the right edge
// 10 - accounts for the window chrome
if (pos + 468 + 10 + 5 > aw) inc = -5;
pos += inc; a380fa.com
window.moveTo(pos, 0);
}
window.onload = startAd;
// -->
</SCRIPT>
當(dāng)頁(yè)面adpage.html裝載后,函數(shù)startAD()被執(zhí)行。如果用戶的瀏覽器支持window.screen對(duì)象,窗口才能移動(dòng),因?yàn)槲覀冃枰褂脀indow.screen來(lái)計(jì)算屏幕的寬度。窗口在屏幕的上邊界滑動(dòng),從左上角(pos=0)一直到右上角。
通過內(nèi)建的setInterval()函數(shù),每隔50毫秒移動(dòng)廣告窗口5個(gè)象素。如果點(diǎn)擊了“stop”按鈕,就將執(zhí)行下面
相關(guān)文章
jQuery判斷密碼強(qiáng)度實(shí)現(xiàn)思路及代碼
實(shí)現(xiàn)思路為:密碼小于六位的時(shí)候,密碼強(qiáng)度圖片都為灰色;密碼為七位及以上并且字母、數(shù)字、特殊字符三項(xiàng)中有兩項(xiàng),強(qiáng)度等等,感興趣的朋友可以參考下哈2013-04-04JavaScript 無(wú)縫上下左右滾動(dòng)加定高定寬停頓效果(兼容ie/ff)
JavaScript 指定寬度高度的無(wú)間斷滾動(dòng)實(shí)現(xiàn)代碼,這樣的效果適合作為焦點(diǎn)新聞的輪播顯示。2010-03-03枚舉的實(shí)現(xiàn)求得1-1000所有出現(xiàn)1的數(shù)字并計(jì)算出現(xiàn)1的個(gè)數(shù)
求得1-1000所有出現(xiàn)1的數(shù)字,并計(jì)算出現(xiàn)1的個(gè)數(shù),以下是采用枚舉的實(shí)現(xiàn)方法,但是若從1-N就不管用了,因?yàn)镹不一定會(huì)是多少2013-09-09javascript 隱藏/顯示指定的區(qū)域附HTML元素【legend】用法
今日閑來(lái)無(wú)事就寫寫JS,用來(lái)顯示/隱藏制定的DIV區(qū)域。2010-03-03JavaScript實(shí)現(xiàn)Tab點(diǎn)擊切換
這篇文章主要為大家詳細(xì)介紹了JavaScript實(shí)現(xiàn)Tab點(diǎn)擊切換,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2022-07-07使用Object.defineProperty如何巧妙找到修改某個(gè)變量的準(zhǔn)確代碼位置
Object.defineProperty() 方法直接在一個(gè)對(duì)象上定義一個(gè)新屬性,或者修改一個(gè)已經(jīng)存在的屬性, 并返回這個(gè)對(duì)象。下面這篇文章主要給大家介紹了關(guān)于使用Object.defineProperty如何巧妙找到修改某個(gè)變量的準(zhǔn)確代碼位置的相關(guān)資料,需要的朋友可以參考下2018-11-11