用jquery写一个简单的菜单伸缩效果

先看下效果图吧!其实是一个很简单的东西。只是对以前的知识复习下。这里就不做详细说明了,懂得jQuery的选择器和效果就行了。

jqueryshowsidebar

jQuery的代码如下:

jQuery(document).ready(function(){
    
jQuery("dd:not(:first)").hide();
        
jQuery("dt a").click(function(){
        
jQuery("dd:visible").slideUp("slow");
        
jQuery(this).parent().next().slideDown("slow");
        
return false;
    
});
});

在上面我们用到了jQuery的”:not”,”:first”,”:visible”,”.parent(Selector) “,”.next(Selector) “这几个选择器以及jQuery的滑动效果”slideUp”,”slideDown”;
不明白可以去参照JQ的参考文档。完整的实例请运行下面的代码!

提示:你可以先修改部分代码再运行。

如果脚本报错.或没效果请多刷新几次.

GOTOP3 条评论 To 用jquery写一个简单的菜单伸缩效果

  1. maimai 说道:

    請問一下淡藍標籤可以直接連結嗎?
    不需伸縮的效果?

  2. bzzd2001 说道:

    测试一下

  3. xiaorsz 说道:

    今天借了本 jQuery 基础教程来看!!
    借上了才发现没什么好看了!多用就是了!!呵呵!

发表评论

电子邮件地址不会被公开。 必填项已用 * 标注

*

您可以使用这些 HTML 标签和属性: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

无觅相关文章插件,快速提升流量