Html中鼠标悬停显示二级菜单的两种方法
时间:2016-09-13 20:52:14
收藏:0
阅读:749
<!DOCTYPE html><html><head><meta charset="UTF-8"><title></title><style type="text/css">ul{list-style: none;float: left;}li{display: none;}</style><script type="text/javascript">function disp(){for(var i = 0; i<3; i++){document.getElementsByClassName(‘sss‘)[i].style.display=‘block‘;}}function out(){for(var i = 0; i<3; i++){document.getElementsByClassName(‘sss‘)[i].style.display=‘none‘;}}</script></head><body><ul onmouseover="disp()" onmouseout="out()"> 手机数码<li class="sss">iPhone</li><li class="sss">SAMSUNG</li><li class="sss">SAMSUNG</li></ul></body></html>
方法二
<!DOCTYPE html><html><head><meta charset="UTF-8"><title></title><style type="text/css">li:hover #b{display: block;}#b{display: none;}</style></head><body><ul><li>sss<ul id="b"><li ></li><li ></li><li ></li><li ></li></ul></li></ul></body></html>
原文:http://www.cnblogs.com/SandyLam/p/5869633.html
评论(0)