此系列将各种你想要实现HTML效果做成一个个最基础的示例,想用时随时取用。因为成品网页的功能繁复,相互牵连。通过此文和后续示例,能快速找到功能模块,插入到你正在开发的网页中。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>新建HTML</title>
</head>
<script type="text/javascript">
window.onload = function () {
//onload表示页面加载完成后执行,listener就要在此之后执行
//alert('页面加载时展示');
document.getElementById("mainmenu").addEventListener("mouseover", function(event){
alert('鼠标移入标题');
});
document.getElementById("product").addEventListener("mouseover", function(){
//每当切换元素mouseover和mouseout会同时执行
//移入其他元素时也是移除当前元素,
});
}
</script>
<body>
<h1 id="mainmenu">我的标题</h1>
<p>我的段落。</p>
</body>
</html>