js控制瀏覽器放大或者縮小

問題一:
希望改變當前頁面所在的瀏覽器窗口的大小
解決方案:
使用window對象的方法:resizeTo()和resizeBy()。比如:
window.resizeTo(800, 600); // 將窗口大小調整爲寬800,高600,單位爲像素
window.resizeBy(50, 50); // 調整窗口大小,在當前基礎上,寬和高各增加50
window.resizeBy(50, 0); // 調整窗口大小,在當前基礎上,只將寬增加50
window.resizeBy(-50, -50); // 調整窗口大小,在當前基礎上,寬和高各減少50
問題二:
上面提到了,resizeTo()和resizeBy()方法不能改變窗口左上角的位置,但有時的確有這種需求,比如最大化窗口。
解決方案:
使用moveTo()方法將瀏覽器窗口移動到屏幕的指定座標位置:
moveTo(100, 100); // 將左上角移至(100, 100)點
使用moveBy()方法將瀏覽器窗口在當前位置基礎上移動一個相對偏移量:
moveBy(50, 50); // 將窗口向右和向下各移動50個像素
兩個函數的定義爲:
window.moveTo(x, y); // x, y 爲新位置的兩個座標值
window.moveBy(dx, dy); // dx, dy 是相對偏移的值
現在能夠改變窗口的大小,也能改變窗口的位置了,如果兩者結合起來就能做更多事情,比如最大化窗口。看下面這個函數:
function maximizeWindow()
{
var offset = (navigator.userAgent.indexOf(“Mac”) != -1 || navigator.userAgent.indexOf(“Gecko”) != -1 ||
navigator.appName.indexOf(“Netscape”) != -1) ? 0 : 4;
window.moveTo(-offset, -offset);
window.resizeTo(screen.availWidth + (2 * offset), screen.availHeight + (2 * offset));
}
該函數能讓窗口占據整個屏幕,看起來確實是最大化了,事實卻不是這樣,不信請查看窗口的最大化按鈕。腳本首先爲Windows設置了一個額外的偏移量4 (原因看後面),然後再調整窗口的位置和大小,模擬一種最大化的效果。其中screen對象的availWidth和availHeight屬性分別表示屏幕的可用寬度和高度(單位爲像素),注意它們不包括任務欄的尺寸。
最大化和最小化的概念主要出現在Windows操作系統中,與Macintosh中的窗口就不一樣(下次去電腦城,得仔細體驗一下有何不同)。也許我們能夠模擬一個最大化窗口,但對於不同的瀏覽器總有些侷限性。首先,在Windows中一個真正最大化的窗口左上角的座標是(-4, -4)而不是(0, 0),這樣能將4像素寬的窗口邊沿隱藏掉,這也是上面腳本中出現4的原因,而Macintosh則允許窗口細長的邊沿總是可見;另外還與瀏覽器有關係,比如FireFox根本就不允許將窗口移至(-4, -4)這個點。
僅僅通過腳本不能使窗口真正地最大化或最小化。但試試下面這段腳本(只在IE下有效),也許會給你一點驚喜:)

出自 http://tech.sina.com.cn/s/2008-06-27/0941710872.shtml

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章