寫網頁寫到好火哦~ (Mozilla 的 JavaScript 支援問題)

放輕鬆,這個版純聊天不談技術,歡迎大家進來坐坐。

寫網頁寫到好火哦~ (Mozilla 的 JavaScript 支援問題)

文章Tetralet » 週四 3月 06, 2003 10:25 pm

最近在寫網頁,
發現 Mozilla 在 JavaScrip 上的支援似乎不及 IE。

我在寫的時候,
一定要求在 IE 及 Mozilla 上都要有相同的效果,
但是,您可以猜到的,
在 Mozilla 上很多東西都出不來。

比如說好了,
我想做一個會永遠出現在視窗左上角的 Menu 選單,
這個 Menu 選單不管視窗如何放大縮小,
都一定出現在那個位置,
有點像是關不掉的廣告那種東西。

結果,看了很多範例,
在 Mozilla 上面都沒有辨法跑。

好不容易找到一、兩個 Mozilla 似乎可以用的,
我換上一個超大的底圖,就破功了。

難道說,
Mozilla 在 JavaScrip 上的支援真的不及 IE 嗎?
我真的必須放棄 Mozilla 的使用者嗎?

對了,
有興趣的,
可以試試下面的程式碼: (IE Only。Mozilla 止步!)

這一個程式碼是別人寫好,已經可以 Run,沒有問題的,
它會在 IE 視窗的左下角出現一個小時鐘,
這個小時鐘不管視窗如何放大縮小,
都一定出現在那個位置,
真的很不錯!


可惜 Mozilla 不能跑... 殘念...

代碼: 選擇全部

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
  <meta http-equiv="content-type"
 content="text/html; charset=ISO-8859-1">
  <title>Test</title>
</head>
<body>

<script language="JavaScript">

//Static analog Clock by kurt.grigg@virgin.net
//Script featured on Website Abstraction
//http://wsabstract.com

fCol='ff8428';//face colour.
sCol='ff0000';//seconds colour.
mCol='9797ff';//minutes colour.
hCol='9797ff';//hours colour.


H='....';
H=H.split('');
M='.....';
M=M.split('');
S='......';
S=S.split('');
Ypos=0;
Xpos=0;
Ybase=8;
Xbase=8;
dots=12;
ns=(document.layers)?1:0;
if (ns){
dgts='1 2 3 4 5 6 7 8 9 10 11 12';
dgts=dgts.split(' ')
for (i=0; i < dots; i++){
document.write('<layer name=nsDigits'+i+' top=0 left=0 height=30 width=30><center><font face=Arial,Verdana size=1 color='+fCol+'>'+dgts[i]+'</font></center></layer>');
}
for (i=0; i < M.length; i++){
document.write('<layer name=ny'+i+' top=0 left=0 bgcolor='+mCol+' clip="0,0,2,2"></layer>');
}
for (i=0; i < H.length; i++){
document.write('<layer name=nz'+i+' top=0 left=0 bgcolor='+hCol+' clip="0,0,2,2"></layer>');
}
for (i=0; i < S.length; i++){
document.write('<layer name=nx'+i+' top=0 left=0 bgcolor='+sCol+' clip="0,0,2,2"></layer>');
}
}
else{
document.write('<div style="position:absolute;top:0px;left:0px"><div style="position:relative">');
for (i=1; i < dots+1; i++){
document.write('<div id="ieDigits" style="position:absolute;top:0px;left:0px;width:30px;height:30px;font-family:Arial,Verdana;font-size:10px;color:'+fCol+';text-align:center;padding-top:10px">'+i+'</div>');
}
document.write('</div></div>')
document.write('<div style="position:absolute;top:0px;left:0px"><div style="position:relative">');
for (i=0; i < M.length; i++){
document.write('<div id=y style="position:absolute;width:2px;height:2px;font-size:2px;background:'+mCol+'"></div>');
}
document.write('</div></div>')
document.write('</div></div>')
document.write('<div style="position:absolute;top:0px;left:0px"><div style="position:relative">');
for (i=0; i < H.length; i++){
document.write('<div id=z style="position:absolute;width:2px;height:2px;font-size:2px;background:'+hCol+'"></div>');
}
document.write('</div></div>')
document.write('<div style="position:absolute;top:0px;left:0px"><div style="position:relative">');
for (i=0; i < S.length; i++){
document.write('<div id=x style="position:absolute;width:2px;height:2px;font-size:2px;background:'+sCol+'"></div>');
}
document.write('</div></div>')
}
function clock(){
time = new Date ();
secs = time.getSeconds();
sec = -1.57 + Math.PI * secs/30;
mins = time.getMinutes();
min = -1.57 + Math.PI * mins/30;
hr = time.getHours();
hrs = -1.57 + Math.PI * hr/6 + Math.PI*parseInt(time.getMinutes())/360;
if (ns){
Ypos=window.pageYOffset+window.innerHeight-60;
Xpos=window.pageXOffset+window.innerWidth-80;
}
else{
Ypos=document.body.scrollTop+window.document.body.clientHeight-60;
Xpos=document.body.scrollLeft+window.document.body.clientWidth-80;
}
if (ns){
for (i=0; i < dots; ++i){
document.layers["nsDigits"+i].top=Ypos-5+40*Math.sin(-0.49+dots+i/1.9);
document.layers["nsDigits"+i].left=Xpos-15+40*Math.cos(-0.49+dots+i/1.9);
}
for (i=0; i < S.length; i++){
document.layers["nx"+i].top=Ypos+i*Ybase*Math.sin(sec);
document.layers["nx"+i].left=Xpos+i*Xbase*Math.cos(sec);
}
for (i=0; i < M.length; i++){
document.layers["ny"+i].top=Ypos+i*Ybase*Math.sin(min);
document.layers["ny"+i].left=Xpos+i*Xbase*Math.cos(min);
}
for (i=0; i < H.length; i++){
document.layers["nz"+i].top=Ypos+i*Ybase*Math.sin(hrs);
document.layers["nz"+i].left=Xpos+i*Xbase*Math.cos(hrs);
}
}
else{
for (i=0; i < dots; ++i){
ieDigits[i].style.pixelTop=Ypos-15+40*Math.sin(-0.49+dots+i/1.9);
ieDigits[i].style.pixelLeft=Xpos-14+40*Math.cos(-0.49+dots+i/1.9);
}
for (i=0; i < S.length; i++){
x[i].style.pixelTop =Ypos+i*Ybase*Math.sin(sec);
x[i].style.pixelLeft=Xpos+i*Xbase*Math.cos(sec);
}
for (i=0; i < M.length; i++){
y[i].style.pixelTop =Ypos+i*Ybase*Math.sin(min);
y[i].style.pixelLeft=Xpos+i*Xbase*Math.cos(min);
}
for (i=0; i < H.length; i++){
z[i].style.pixelTop =Ypos+i*Ybase*Math.sin(hrs);
z[i].style.pixelLeft=Xpos+i*Xbase*Math.cos(hrs);
}
}
setTimeout('clock()',50);
}
if (document.layers || document.all) window.onload=clock;
//-->
</script>
</body>
</html>


最後由 Tetralet 於 週五 3月 07, 2003 11:33 am 編輯,總共編輯了 1 次。
Tetralet
俺是博士
俺是博士
 
文章: 3078
註冊時間: 週四 11月 28, 2002 3:02 pm

文章mason » 週五 3月 07, 2003 11:26 am

先聲明,我 reply 這篇的時候,並沒有仔細去看您的 javascript.

我想您的問題不是要不要放棄 mozilla users,而是要不要放棄標準。
IE 有太多為了方便 programmer coding 而擅自加入的功能,而這些東西並不是標準的規範之內的產物。

Microsoft 一向的作風便是如此,先是擁抱標準,然後 extend 標準,最後使自己成為標準。

也某些方面, Mozilla 真的是不如 IE 方便,但 Mozilla 才是符合 W3C 標準的 browser
一個不符合標準的產物現在是該領域內最大宗,這種現象我想並不是大家所樂見的。
頭像
mason
快樂的大學生
快樂的大學生
 
文章: 547
註冊時間: 週二 9月 10, 2002 3:40 pm
來自: SIDE 3

文章Tetralet » 週五 3月 07, 2003 11:43 am

mason 寫:先聲明,我 reply 這篇的時候,並沒有仔細去看您的 javascript.


對不起、對不起,我沒有說清楚,
那個程式是別人寫好可以跑沒有問題的程式,
我只是想提一個很炫、IE 可以跑但是 Mozilla 不能跑的程式,
給大家參考看看。

貼出一大段 Script 請別人 Debug 我認為不是應該鼓勵的行為。


mason 寫:我想您的問題不是要不要放棄 mozilla users,而是要不要放棄標準。
IE 有太多為了方便 programmer coding 而擅自加入的功能,而這些東西並不是標準的規範之內的產物。

Microsoft 一向的作風便是如此,先是擁抱標準,然後 extend 標準,最後使自己成為標準。

也某些方面, Mozilla 真的是不如 IE 方便,但 Mozilla 才是符合 W3C 標準的 browser
一個不符合標準的產物現在是該領域內最大宗,這種現象我想並不是大家所樂見的。


嗯,我只好針對每一個 Browser 來寫程式,
但是覺得這樣好浪費時間精力!
同時要了解 IE 和 Mozilla 的寫法...

我只是想知道,
是因為 Mozilla 本身無法完全支援 Java Script,
還是 IE 又在自訂規格呢?

如果是因為 Mozilla 本身無法完全支援 Java Script,
我會耐心等待 Mozilla 新版本的釋出。

如果是 IE 又在自訂規格,
那我只好放棄那種寫法了。
Tetralet
俺是博士
俺是博士
 
文章: 3078
註冊時間: 週四 11月 28, 2002 3:02 pm

文章ronald » 週五 3月 07, 2003 12:21 pm

樂者為王 - just for fun
ronald
摩托學園!學園長們
摩托學園!學園長們
 
文章: 76
註冊時間: 週二 9月 03, 2002 11:48 am

文章mason » 週五 3月 07, 2003 12:24 pm

as far as I know
那些 script 中大量用到的 document.layers[] 就不是 W3C standards.

http://www.stopbadtherapy.com/standards.shtml
頭像
mason
快樂的大學生
快樂的大學生
 
文章: 547
註冊時間: 週二 9月 10, 2002 3:40 pm
來自: SIDE 3

文章Tetralet » 週五 3月 07, 2003 1:17 pm

ronald 寫:http://ncthakur.itgo.com/cutpastejs.htm


在這個網頁裡我找到了我想做到的效果。謝謝!
(請問您是哪找的呀?我怎麼都找不到?)

不過裡面還是有針對各 Browser 而有不同的寫法...

看:

代碼: 選擇全部
///// BROWSER DETECTION /////
NS6 = (document.getElementById&&!document.all)
IE = (document.all)
NS = (navigator.appName=="Netscape" && navigator.appVersion.charAt(0)=="4")


非常非常謝謝您!
Tetralet
俺是博士
俺是博士
 
文章: 3078
註冊時間: 週四 11月 28, 2002 3:02 pm

文章Tetralet » 週五 3月 07, 2003 1:19 pm

mason 寫:as far as I know
那些 script 中大量用到的 document.layers[] 就不是 W3C standards.

http://www.stopbadtherapy.com/standards.shtml


收到!謝謝!
都是荳芽菜,
先好好啃啃再說。
Tetralet
俺是博士
俺是博士
 
文章: 3078
註冊時間: 週四 11月 28, 2002 3:02 pm


回到 talk

誰在線上

正在瀏覽這個版面的使用者:沒有註冊會員 和 1 位訪客