學了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>