省机关事务局网站建设管理情况,福州做网站改版哪里比较好,网站建设的英语,wordpress启动命令无聊#xff0c;就自己写了一个手风琴的下拉菜单#xff0c;写之前要介绍以下几个JQuery函数的用法#xff1a; 1.children()方法 #xff0c;表示当前元素下的子元素#xff0c;函数内可以有参数#xff0c;参数为“子元素”的名称。 2.slideToggle()方法#xff0c;在…无聊就自己写了一个手风琴的下拉菜单写之前要介绍以下几个JQuery函数的用法 1.children()方法 表示当前元素下的子元素函数内可以有参数参数为“子元素”的名称。 2.slideToggle()方法在JQuery中表示向上/向下滑动样式切换。参数可以取“slow”、“fast”、毫秒 3.slideUp()方法 用于向上滑动元素。参数可以取“slow”、“fast”、毫秒。 4.siblings()方法用于返回被选元素的所有同胞元素。如果加参数表示被选元素的所有“参数”的同胞元素。 具体参见http://www.runoob.com/jquery/jquery-traversing-siblings.html 下的JQuery 同胞详解。 好我们知道了以上函数我们开始编写代码 !DOCTYPE html
htmlheadmeta charsetUTF-8title折叠选项框/titlescript typeapplication/javascript srcjs/jquery-1.9.1.js/scriptscript typeapplication/javascript$(function(){$(#list li p).css(color,royalblue);$(.main ul li ).click(function(){$(this).children(ul .menu).slideToggle();//siblings() 表示当前元素的所有同胞元素$(this).siblings().children(ul .menu).slideUp();});});/scriptstyle typetext/css.main{width: 300px;height: 520px;border: 1px red solid;}.menulist{list-style: none;}.menu{color: darkmagenta;font: 微软雅黑;display: none;}/style/headbodydiv classmainul idlistli classmenulistp电视/pul classmenu styledisplay:blockli长虹电视/lilisky电视/lili三星电视/li/ul/lili classmenulistp电脑/pul classmenuli索尼电脑/lili戴尔电脑/lili华硕电脑/li/ul/lili classmenulistpipdad/pul classmenuliApple IPad nimi/liliApple IPad Air Pro/liliApple IPad Air2/li/ul/lili classmenulistp手机/pul classmenuliOPPO/liliVIVO/lili小米/lili华为/li/ul/li/ul/div/body
/html 运行结果展示 点击后的样式展示 转载于:https://www.cnblogs.com/wll-cs/p/6672227.html
