📄 15-29.htm
字号:
<html><head><title>确定鼠标指针所在位置的元素</title>
<style type="text/css">
body { background-color: pink;
font-size: 22pt;
font-weight: bold;
}
.red { color:rgb(255,0,0);
font-style: italic;
font-size: 32;
}
.blue { color:blue;
font-size: 36;
}
.green { color: green;
font-size: 40;
}
.yellow { color: yellow;
font-size: 45;
}
.black { color: black;
}
</style>
<script language="javascript">
function init(){
div1=document.getElementById("first");
div2=document.getElementById("second");
div3=document.getElementById("third");
div4=document.getElementById("fouth");
}
function colorText(e){
switch (e.srcElement.id){ //对NN来说，使用 e.currentTarget.id
case "first":
div1.className="red";
break;
case "second":
div2.className="blue";
break;
case "third":
div3.className="green";
break;
case "fouth":
div4.className="yellow";
break;
}
}
function unColorText(e){
switch (e.srcElement.id){ //对NN来说，使用 e.currentTarget.id
case "first":
div1.className="black";
break;
case "second":
div2.className="black";
break;
case "third":
div3.className="black";
break;
case "fouth":
div4.className="black";
break;
}
}
</script>
</head>
<body onLoad="init()">
<h1> 月夜忆舍弟</h1>
<div id="first"
style="position:absolute; top:100px"
onMouseover="unColorText(event);"
onMouseout="colorText(event);">戌鼓断人行，秋边一雁声。 </div>
<div id="second"
style="position:absolute; top:150px"
onMouseover="unColorText(event);"
onMouseout="colorText(event);">露从今夜白，月是故乡明。</div>
<div id="third"
style="position:absolute; top:200px"
onMouseover="unColorText(event);"
onMouseout="colorText(event);">有弟皆分散，无家问死生。</div>
<div id="fouth"
style="position:absolute; top:250px"
onMouseover="unColorText(event);"
onMouseout="colorText(event);">寄书长不达，况乃未休兵。</div>
</body>
</html>
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -