源码网商城,靠谱的源码在线交易网站 我的订单 购物车 帮助

源码网商城

jQuery 渐变下拉菜单

  • 时间:2021-03-12 12:01 编辑: 来源: 阅读:
  • 扫一扫,手机访问
摘要:jQuery 渐变下拉菜单
这里主要是利目标在鼠标经过时(.hover())利用slideToggle() 、slideUp()来显示原来隐藏着的内容:
[url=]<p>使用slideToggle和slideUp来实现.当然,也可以使用hide/show, fadeIn/fadeOut等来实现,只是效果不同,实现的方法还是相同的.需要注意的是,要给.dropdown加上position:relative;防止闪烁.</p> <ul class="fir"> <li class="dropdown"> <a class="rssfeed"><img src="feedme.png" alt="feedme" /></a> <ul> <li><a href="#" rel="RSS"><img src="rss.gif" alt="RSS Feed" /></a></li> <li><a href="#" class="xg" rel="nofollow">鲜果订阅</a></li> <li><a href="#" class="gr" rel="nofollow">Google订阅</a></li> <li><a href="#" class="zx" rel="nofollow">抓虾订阅</a></li> <li><a href="#" class="yd" rel="nofollow">有道订阅</a></li> <li><a href="#" class="more-rss" rel="RSS">更多方式 »</a></li> </ul> </li> </ul> </div> <script language="javascript" type="text/javascript" src="jquery.min.js"></script> <script language="javascript" type="text/javascript"> $(function(){     $(".fir .dropdown").hover(         function(){             $("li ul").slideToggle(800);         },function(){             $("li ul").slideUp(1000)         }) }) </script> </body> </html>
测试代码打包下载[/url]
  • 全部评论(0)
联系客服
客服电话:
400-000-3129
微信版

扫一扫进微信版
返回顶部