-
动画实现方法查看全部
-
JQuery库引用方法查看全部
-
下拉菜单查看全部
-
动画的三种实现方法查看全部
-
CSS实现下拉菜单显示和隐藏<br> 1、为避免鼠标移到li上时点击无效,将a标签设置成块级元素,padding控制间距;<br> 2、用display:none隐藏二级菜单(ul),用display:block显示二级菜单;<br> 3、用 #nav ul li:hover ul{display:block} 控制鼠标移到一级菜单时显示对应的二级菜单;<br> 4、absolute要配合top,left来使用;<br> 5、垂直居中使用height和lineheight一样来实现,水平居中使用text-align:center。查看全部
-
padding{0 value}宽度自适应查看全部
-
JS实现下拉菜单:<br> 1.先做好静态页面(下拉菜单要隐藏)<br> 2.给有下拉菜单的li元素添加事件(onmouseover,onmouseout),通过事件调用自定义函数,给函数传入触发事件的元素(li.getElementsByTagName("ul")[0]获取li对应的下拉菜单,再设置其display属性)查看全部
-
如何在一级菜单下加下拉菜单: 1、在每一个要加下拉菜的li中,加入无序列表 2、先使用display:none隐藏下拉菜单,hover时使用display:block显示下拉菜单 3、将下拉菜单设置成绝对定位,定位参照物为其父级标签(tips:absolute,relative)查看全部
-
JS与JQ制作下拉菜单的比较查看全部
-
<style type="text/css"> *{ margin:0px; padding:0px;} #menu{ background-color:#eee; width:600px; height:40px; margin:0 auto;} ul{ list-style:none;} ul li{ line-height:40px; text-align:center; position:relative; float:left; } a{ text-decoration:none; color:#000; display:block; width:90px;} a:hover{ color:#FFF; background-color:#666;} ul li ul li{ float:none;margin-top:2px; background-color:#eee; } ul li ul{width:90px; position:absolute; display:none; } ul li:hover ul{display:block;} </style> </head> <body> <div id="menu"> <ul> <li><a href="#">首页</a></li> <li><a href="#">课程大厅</a> <ul> <li><a href="#">HELLO</a></li> <li><a href="#">案例学习</a></li> <li><a href="#">交流平台</a></li> </ul> </li> <li><a href="#">学习中心</a> <ul> <li><a href="#">视频学习</a></li> <li><a href="#">案例学习</a></li> <li><a href="#">交流平台</a></li> </ul> </li> <li><a href="#">经典案例</a></li> <li><a href="#">关于我们</a></li> </ul> </div> </body> </html>查看全部
-
自适应高度 宽度用padding查看全部
-
$("#rList").on("click",function(){ if($("ul li").hasClass("active")){ $("ul li").css("visibility","hidden").removeClass("active"); }else{ $("ul li").css("visibility","visible").addClass("active"); } })查看全部
-
<script type="text/javascript"> window.onload = function(){ var isIE = !!window.ActiveXObject; /*只有当浏览器为IE时返回‘是’*/ var isIE6 = isIE && !window.XMLHttpRequest; /*是不是IE6,是的话支持XMLHttpRequest,不是的话不支持XMLHttpRequest判断为IE6以下版本*/ if(isIE6){ var Lis = document.getElementsByTagName("li") /*如果是IE6的话找到所有的"li"标签*/ for (var i =0 ; i < Lis.lengthl;i++){ /*循环语句*/ Lis[i].onmouseover = function(){ var u= this.getElementsByTagName("ul")[0]; if(u!=underfined){ u.style.display="block"; } } Lis[i].onmouseout = function(){ var u= this.getElementsByTagName("ul")[0]; if(u!=underfined){ u.style.display="none"; } } } } } </script>查看全部
-
三级菜单制作大体步骤:<br> 1、一级菜单横向显示。<br> 2、去电列表项目符号。<br> 3、隐藏二级和三级菜单。(注:二级菜单是三级菜单的包含快,隐藏二级菜单时也隐藏了三级菜单) 4、鼠标滑过一级菜单时显示二级菜单、隐藏三级菜单 .top_nav li:hover ul{display:block;} .top_nav li:hover ul li ul{display:none;} 5、鼠标滑过二级菜单时显示三级菜单 .top_nav li ul li:hover ul{display:block;} 注:ul默认是向下瀑布流排列,实现三级菜单效果时,可以用position:relative;定义二级菜单,再用position:absolute;定义三级菜单,然后设置相应的偏移量即可。查看全部
-
overflow:auto;并不会在该元素上清楚浮动,它将清楚自己。意思就是说应用了overflow:auto;的元素,将会扩展到它需要的大小,以便包含它里面浮动的元素查看全部
举报
0/150
提交
取消