码迷,mamicode.com
首页 > Web开发 > 详细

HTML练习_隐藏导航

时间:2015-12-27 16:07:41      阅读:133      评论:0      收藏:0      [点我收藏+]

标签:

 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 2 <html xmlns="http://www.w3.org/1999/xhtml">
 3 <head>
 4 <style type="text/css">
 5 *
 6 {
 7     margin:0px;
 8     padding:0px;
 9 }
10 #a
11 {
12     height:40px;
13     width:120px;
14     background-color:#0F0;
15     top:80px;
16     left:200px;
17     position:absolute;
18     overflow:hidden;
19     text-align:center;
20     line-height:40px;
21 }
22 #b
23 {
24     height:90px;
25     width:120px;
26     left:0px;
27     top:40px;
28     background-color:#F00;
29     position:absolute;
30 }
31 table
32 {
33     height:120px;
34     width:120px;
35     border:0px;
36     text-align:center;
37     vertical-align:middle;
38 }
39 </style>
40 
41 
42 </head>
43 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
44 <title>隐藏导航练习</title>
45 </head>
46 
47 <body>
48 <div id="a" onmouseover="over()" onmouseout="out()">新闻动态
49 <div id="b">
50 <table cellpadding="0" cellspacing="0">
51 <tr><td bgcolor="#00FF00">场景</td></tr>
52 <tr><td bgcolor="#FF0000">活动</td></tr>
53 <tr><td bgcolor="#0000FF">杂谈</td></tr>
54 </table>
55 <script>
56 function over()
57 {
58     var aa = document.getElementById(a);
59     a.setAttribute("style","overflow:visible;background-color:#3FC");
60 }
61 function out()
62 {
63     var bb = document.getElementById(a);
64     a.setAttribute("style","overflow:hidden;background-color:#339");
65 }
66 </script>
67 
68 </div></div>
69 </body>
70 </html>

 

HTML练习_隐藏导航

标签:

原文地址:http://www.cnblogs.com/sihuiming/p/5080126.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!