學了PHP和HTML了技術=_=,卻發現自己 js 的功力只僅限於看的懂卻很沒fu的程度,大概就是那種一篇文章看的懂,但是要自己寫出來卻寫不出來,但又可以去網路上抓一些小短文貼到自己文章裡面的程度。

 

所以拉,基於萬丈高樓平地起的理念,我決定還是先把地基打好打勞吧,雖然說要花一點時間就是了。

 

 

以下的code涵蓋兩個範例

1. checkbox+tooltip

2. div ( mouseout + mouseOver + function + 變大變小 )

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>無標題文件</title>
<style>
#div1 {
    width:200px; 
    height:100px;
    background:#CCC;
    border:1px solide#999; 
    display:none;
    }

#div2 {
    width:200px; 
    height:200px;
    background:red;
    }
</style>
<script>
function toGreen()
{
    //JS 裡面的變量
    var oDiv = document.getElementById('div2');
    
    oDiv.style.width='300px'
    oDiv.style.height='300px';
    oDiv.style.background='green';
}
function toRed()
{
    //JS 裡面的變量
    var oDiv = document.getElementById('div2');
    oDiv.style.width='200px'
     oDiv.style.height='200px';
    oDiv.style.background='red';
}
</script>


</head>
<body>
<input type="checkbox" onMouseOver="div1.style.display='block'" onMouseOut="div1.style.display='none'" />
<div id="div1">
    Hello World...
</div>
 
 <div id="div2" onMouseOver="toGreen()" 
                 onMouseOut ="toRed()  "/>

</body>
</html>

arrow
arrow
    全站熱搜
    創作者介紹
    創作者 Eric 的頭像
    Eric

    一個小小工程師的心情抒發天地

    Eric 發表在 痞客邦 留言(0) 人氣()