function alertSize() {
var myWidth = 0, myHeight = 0;
if( typeof( window.innerWidth ) == 'number' ) {
//Non-IE
myWidth = window.innerWidth;
myHeight = window.innerHeight;
} else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
//IE 6+ in 'standards compliant mode'
myWidth = document.documentElement.clientWidth;
myHeight = document.documentElement.clientHeight;
} else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
//IE 4 compatible
myWidth = document.body.clientWidth;
myHeight = document.body.clientHeight;
}
window.alert( 'Width = ' + myWidth );
window.alert( 'Height = ' + myHeight );
}星期二, 八月 12, 2008
取得現用視窗大小
原本以為在HTML的DOＭ裏取得視窗大小是件簡單的事，沒想到IE4與IE6也不同，隨便抓到這不完全正確，幸好這有解。以下是它的解法：
滿版的Flash網頁
滿版和全螢幕英文都叫Full Screen，但我要的效果是整個html裏都是flash object。
其實不難，只要把width和height都設成100%就可以：
僅供自己參考。
其實不難，只要把width和height都設成100%就可以：
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000"
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0"
width="100%" height="100%" id="menu" align="middle">
<param name="allowScriptAccess" value="sameDomain" />
<param name="movie" value="index.swf" />
<param name="quality" value="best" />
<param name="bgcolor" value="#306790" />
<embed src="index.swf" quality="high"
bgcolor="#306790" width="100%" height="100%" name="menu" align="middle"
allowScriptAccess="sameDomain" type="application/x-shockwave-flash"
pluginspage="http://www.macromedia.com/go/getflashplayer" />
</object>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
僅供自己參考。
星期三, 六月 11, 2008
從frame/iframe頁面存取主頁
前幾天雅痞學弟說要跨 frame 設定CSS，我想這應該需要靠JavaScript才做得到。今天抽空稍微試了一下，果然很容易。
假設分為二個frame，在一個frame用
今天忽然想到，若是iframe呢？查了一下w3c school，可以用contentDocument屬性，也就是
簡單地說，利用contentWindow屬性，同樣能找到document物件。
參考：
contentWindow at mozilla
contentWindow Property at msdn （在下強烈建議別用document.all這種非標準的寫法呀...）
假設分為二個frame，在一個frame用
var document1 =parent.frames[0].document;就可以輕鬆存取另一個頁面的dom物件。
今天忽然想到，若是iframe呢？查了一下w3c school，可以用contentDocument屬性，也就是
var document1 = document.getElementById('iframe1').contentDocument;可惜IE不支援。接著就只好找非標準的寫法，這有解。
簡單地說，利用contentWindow屬性，同樣能找到document物件。
var document1 = document.getElementById('iframe1').contentWindow;contentWindow屬性算是非標準，但Firefox其實也支援。上文中的 window.frames[frame名].document 的方式，把 iframe 當 frame 看待，感覺上怪怪的，而且又是IE only，您就別用了。
參考：
contentWindow at mozilla
contentWindow Property at msdn （在下強烈建議別用document.all這種非標準的寫法呀...）
星期六, 五月 19, 2007
IE6特有的殘像拳
最近寫一個簡單的查詢網頁，但使用者反應畫面會有殘像。經測試得知IE5.5，IE 7都不會發生，唯獨IE 6.0才有此殘像拳功夫；請看IE6殘像拳範例（若沒看到殘像請用滾輪捲動）。
這個問題似乎遇到的人不多，經過不斷的測試，找出問題在以下的CSS：
此招得配合frame或iframe包住此網頁，並且有div之類的tag，加上必須捲動的特性就會觸發。
前幾天只有在中國的網站有看到某位仁兄提到，但並無解。要避免此情形之發生，唯有移除image或是不要包在frame裏。
這個問題似乎遇到的人不多，經過不斷的測試，找出問題在以下的CSS：
body已經不記得是在那本書上抄來的，但就是想做到浮水印效果。
{
background-image: url(images/logo.png);
background-position: center 200px;
background-repeat: no-repeat;
background-attachment: fixed;
}
此招得配合frame或iframe包住此網頁，並且有div之類的tag，加上必須捲動的特性就會觸發。
前幾天只有在中國的網站有看到某位仁兄提到，但並無解。要避免此情形之發生，唯有移除image或是不要包在frame裏。
星期四, 十月 26, 2006
IE特有的事件處理方式
最近看到某大軟體公司的asp程式，發現IE特有的事件處理方式。
宣告函數名稱： 控制項 id_事件() 就會在事件發生時觸發。限定在VBScript使用，JavaScript無效。
IE7在beta版時把這些非標準DHTML移除，但在正式版又重新支援，另一個例子像document.all(id)；如果改寫，請記得改為document.getElementById(id)，這是目前的DOM標準。
另外，在這次測試無意中發現Firefox的JavaScript 函數名稱會分大小寫，而IE不會。
以下為測試網頁原始碼：
宣告函數名稱： 控制項 id_事件() 就會在事件發生時觸發。限定在VBScript使用，JavaScript無效。
IE7在beta版時把這些非標準DHTML移除，但在正式版又重新支援，另一個例子像document.all(id)；如果改寫，請記得改為document.getElementById(id)，這是目前的DOM標準。
另外，在這次測試無意中發現Firefox的JavaScript 函數名稱會分大小寫，而IE不會。
以下為測試網頁原始碼：
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>測試IE6、IE7與Firefox 2.0相容性</title>
</head>
<body>
測試OnChange事件，隨便填一個字後點到空白處或按Tab
<script language="vbscript" type="text/vbscript">
<!--
sub t1_onChange()
alert ("t1 OnChange VBScript 事件")
end sub
-->
</script>
<script language="JavaScript" type="text/javascript">
<!--
function t1_onChange()
{
alert("t1 OnChange JavaScript 事件");
}
function ClickMe()
{
var label1;
label1 = document.getElementById('t2');
label1.value= label1.value + "getElementById ";
label1 = document.all('t2'); // Firefox執行到這裏會錯
//Update: 現在Firefox會接受document.all，但會有警告，可打開錯誤主控台看
label1.value= label1.value + "document.all ";
}
-->
</script>
<input type="text" id="t1" name="t1" onChange="javascript:t1_onChange()" />
<input type="button" name="b1" id="b1" value="按我" onClick="javascript:ClickMe()" />
<input type="text" id="t2" name="t2" value="" />
</form>
</body>
</html>
訂閱：
文章 (Atom)
