Event

簡介

Event是什麼呢? 當訪客點一個 Button, Click的Event 就產生了。 當滑鼠箭頭點到一個連結時, MouseOver的 Event就產生了。 我們叫 Click 和MouseOver Event指令(英文: Event-Handler)。

方法



範例語法

<input type="button" value="onClick" onClick="alert('Hi,Event onClick')">

<input type="button" value="onMouseOver" onMouseOver="alert('Hi,Event onMouseOver')">

<input type="button" value="onMouseOut" onMouseOut="alert('Hi,Event onMouseOut')">

<BODY onUnload="alert('你~不~要~走')">



簡易換圖

<script language="JavaScript">
function up() 
    for(var i=0;i < document.UpDown.length;i++) {
        document.UpDown[i].src="../../public/images/java.jpg"; 
    }
}

function down(line,filename)
    for(var i=0;i < document.getElementsByName(line).length;i++) {
        document.getElementsByName(line)[i].src="../../public/images/"+filename+".png";
    }
}
</script>

<img src="../../public/images/java.jpg" name="UpDown" border=0 onMouseOver="up();"         onMouseOut="down(this.name,'java2');"/>

<img src="../../public/images/java.jpg" name="UpDown" border=0 onMouseOver="up();" onMouseOut="down('UpDown','java2');"/>


更換背景顏色

<A HREF="#" onMouseOver="bgColor='#B1CBE4'"><font color="#B1CBE4"></font></A>
<A HREF="#" onMouseOver="bgColor='#FF9900'"><font color="#FF9900">■</font></A>  
<A HREF="#" onMouseOver="bgColor='#000000'"><font color="#000000">■</font></A>  
<A HREF="#" onMouseOver="bgColor='#CC3300'"><font color="#CC3300">■</font></A>  
<A HREF="#" onMouseOver="bgColor='#CC6699'"><font color="#CC6699">■</font></A>  
<A HREF="#" onMouseOver="bgColor='#A9B88D'"><font color="#A9B88D">■</font></A> 
<A HREF="#" onMouseOver="bgColor='#ffffff'"><font color="#ffffff">■</font></A>


文字顏色

<script language="JavaScript">
function changeColorOver() {
document.getElementById('change').style.color='#448ECC';
}

function changeColorOut() {
document.getElementById('change').style.color='#red';
}
</script>

<a href="#" onMouseOver="this.style.backgroundColor='#000080'" onMouseOut="this.style.backgroundColor='#c0c0c0'">文字變底色</a>

<a href='#' id=change onMouseOver='changeColorOver();' onMouseOut='changeColorOut();'>文字換色</a>





Comments