<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title> </head> <body> <div id="aa" onmouseover="aaover()" onmouseout="aaout()" style="height:40px; width:100px; top:120px; left:200px; background-color:#F00;position:absolute; overflow:hidden; line-height:40px; text-align:center; vertical-align:middle;">新闻 <div id="bb" onmouseover="bbover()" onmouseout="bbout()" style="height:40px; width:100px; top:40px; left:0px; background-color:#FF0; position:absolute; overflow:hidden; line-height:40px; text-align:center; vertical-align:middle;">场景 <div style="height:40px; width:100px; top:0px; left:100px;background-color:#09F; position:absolute; line-height:40px; text-align:center; vertical-align:middle;">自然</div> <div style="height:40px; width:100px; top:40px; left:100px;background-color:#3F0; position:absolute; line-height:40px; text-align:center; vertical-align:middle;">政治</div> <div style="height:40px; width:100px; top:80px; left:100px;background-color:#FF0; position:absolute; line-height:40px; text-align:center; vertical-align:middle;">人文</div> </div> <div id="cc" onmouseover="ccover()" onmouseout="ccout()" style="height:40px; width:100px; top:80px; left:0px; background-color:#0FF; position:absolute; line-height:40px; text-align:center; vertical-align:middle; overflow:hidden;">活动 <div style="height:40px; width:100px; top:0px; left:100px;background-color:#09F; position:absolute; line-height:40px; text-align:center; vertical-align:middle;">亲子</div> <div style="height:40px; width:100px; top:40px; left:100px;background-color:#3F0; position:absolute; line-height:40px; text-align:center; vertical-align:middle;">节日</div> <div style="height:40px; width:100px; top:80px; left:100px;background-color:#FF0; position:absolute; line-height:40px; text-align:center; vertical-align:middle;">联欢</div> </div> <div id="dd" onmouseover="ddover()" onmouseout="ddout()" style="height:40px; width:100px; top:120px; left:0px; background-color:#06F; position:absolute; line-height:40px; text-align:center; vertical-align:middle; overflow:hidden;">杂谈 <div style="height:40px; width:100px; top:0px; left:100px;background-color:#09F; position:absolute; line-height:40px; text-align:center; vertical-align:middle;">旅游胜地</div> <div style="height:40px; width:100px; top:40px; left:100px;background-color:#3F0; position:absolute; line-height:40px; text-align:center; vertical-align:middle;">文化圣地</div> <div style="height:40px; width:100px; top:80px; left:100px;background-color:#FF0; position:absolute; line-height:40px; text-align:center; vertical-align:middle;">政治名都</div> </div> </div> </body> </html> <script type="text/javascript"> function aaover() {var a=document.getElementById("aa") a.setAttribute("style","height:40px; width:100px;top:120px;left:200px;background-color:#F00;position:absolute;line-height:40px; text-align:center; vertical-align:middle;overflow:visible;") } function aaout() { var a=document.getElementById("aa") a.setAttribute("style","height:40px; width:100px;top:120px;left:200px;background-color:#F00;position:absolute; line-height:40px; text-align:center; vertical-align:middle;overflow:hidden;") } function bbover() {var b=document.getElementById("bb") b.setAttribute("style","height:40px; width:100px; top:40px; left:0px;background-color:#FF0;position:absolute; line-height:40px; text-align:center; vertical-align:middle;overflow:visible;") } function bbout() { var b=document.getElementById("bb") b.setAttribute("style","height:40px; width:100px; top:40px; left:0px; background-color:#FF0;position:absolute; line-height:40px; text-align:center; vertical-align:middle;overflow:hidden;") } function ccover() {var c=document.getElementById("cc") c.setAttribute("style","height:40px; width:100px; top:80px; left:0px; background-color:#0FF;position:absolute; line-height:40px; text-align:center; vertical-align:middle;overflow:visible;") } function ccout() { var c=document.getElementById("cc") c.setAttribute("style","height:40px; width:100px; top:80px; left:0px; background-color:#0FF;position:absolute; line-height:40px; text-align:center; vertical-align:middle;overflow:hidden;") } function ddover() {var d=document.getElementById("dd") d.setAttribute("style","height:40px; width:100px; top:120px; left:0px; background-color:#06F;position:absolute;line-height:40px; text-align:center; vertical-align:middle;overflow:visible;") } function ddout() { var d=document.getElementById("dd") d.setAttribute("style","height:40px; width:100px; top:120px; left:0px; background-color:#06F;position:absolute;line-height:40px; text-align:center; vertical-align:middle;overflow:hidden;") } </script>
