你的位置:首页 > 软件开发 > Java > 这个jQuery导航菜单怎么样

这个jQuery导航菜单怎么样

发布时间:2015-06-10 00:00:07
效果体验:http://keleyi.com/keleyi/phtml/jqtexiao/39.htmHTML文件代码:<!DOCTYPE html><html ="http://www.w3.org/1999/xhtml"><h ...

效果体验:HTML文件代码:

<!DOCTYPE html><html ="http://www.w3.org/1999/xhtml"><head><title>jQuery鼠标悬停上下滑动导航条 - 柯乐义</title><base target="_blank" /><link href="http://keleyi.com/keleyi/phtml/jqtexiao/39/hovertreedaohang.css" rel="stylesheet" type="text/css" /><script src='/images/loading.gif' data-original="http://hovertree.com/ziyuan/jquery/jquery-1.11.3.min.js"></script><script>$(document).ready(function() {$("#hovertreecaidan li a").wrapInner( '<span ></span>' );$("#hovertreecaidan li a").each(function() {$( '<span >' + $(this).text() + '</span>' ).appendTo( this );});$("#hovertreecaidan li a").hover(function() {$(".out",  this).stop().animate({'top':  '48px'},  300); // move down - hide$(".over",  this).stop().animate({'top':  '0px'},   300); // move down - show}, function() {$(".out",  this).stop().animate({'top':  '0px'},   300); // move up - show$(".over",  this).stop().animate({'top':  '-48px'},  300); // move up - hide});});</script></head><body><div id="hovertreecaidan" class="hovertreedaohang"><ul><li><a href="http://keleyi.com">首 页</a></li><li><a href="http://keleyi.com/menu/jquery/">jQuery</a></li><li><a href="http://keleyi.com/menu/webqd/">Web前端</a></li><li><a href="http://keleyi.com/menu/javascript/">Javascript</a></li><li><a href="http://keleyi.com/menu/html5/">HTML5</a></li><li><a href="http://hovertree.com/">HoverTree</a></li><li><a href="http://hovertree.com/texiao/">网页特效</a></li><li><a href="http://tool.keleyi.com/">工具</a></li><li><a href="http://hovertree.com/guestbook/">留言</a></li></ul><div class="hvtclear"></div></div> </body></html>

原标题:这个jQuery导航菜单怎么样

关键词:jquery

*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们: admin#shaoqun.com (#换成@)。

可能感兴趣文章

我的浏览记录