-
動畫實現方法查看全部
-
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
提交
取消