1、布局:一级导航用ul li ,二级导航在li 里面可以嵌套div实现
<li class="pull-active"> <a href="">资讯</a> <!-- 二级导航 --> <div class="ul ulH3"> <div class="li"> <a href="">活动</a> </div> <div class="li"> <a href="">通知</a> </div> <div class="li"> <a href="">新闻</a> </div> <div class="li"> <a href="">政策</a> </div> </div> </li>
2、交互:鼠标移入改变背景和字体颜色,移除去掉。
$(".pull-active").mouseover(function () { this.style.background = ‘#f39800‘; this.style.borderRadius = ‘5px‘; this.style.color = "white"; $(this).children(‘.ul‘).fadeIn().css("display",‘block‘); }).mouseleave(function () { $(this).children(‘.ul‘).fadeOut().css("display", ‘none‘); this.style.background = ‘none‘; this.style.color = ‘none‘; });
原文地址:https://www.cnblogs.com/jervy/p/12699911.html
时间: 2024-11-08 20:38:23