jquery实现简单下拉菜单效果怎么设置,jquery实现简单的下拉菜单

jquery实现简单下拉菜单效果怎么设置,jquery实现简单的下拉菜单,jquery实现简单下拉菜单效果

本文主要详细介绍jquery实现简单下拉菜单效果。本文中的示例代码非常详细,具有一定的参考价值。感兴趣的朋友可以参考一下。

本文用几行简单的jquery代码实现了一个简单的下拉菜单效果,供大家参考。具体内容如下

看效果。

超文本标记语言

保险商实验所

主题市场

保险商实验所

体育学校

保险商实验所

Li三级菜单a/li

Li三级菜单b/li

Li三级菜单c/li

Li三级菜单d/li

/ul

/李

优车族

保险商实验所

三电平

保险商实验所

四级李/李

四级李/李

四级李/李

/ul

/李

三年级李/李

三年级李/李

三年级李/李

/ul

/李

李生活馆/李

/ul

/李

特色购物

保险商实验所

李淘宝二手/李

李拍卖/李

李喜欢购物

李全球购/李

李桃女/李

/ul

/李

促销

保险商实验所

李天天特价/李

li免费试用/li

李解围/李

李元开拍/李

/ul

/李

Li工具/li

/ul

简单地设置css。

style type='text/css '

ul li {

列表样式:无;

}

li ul {

显示:无;

}。加号{

list-style-image:URL(img/plus . gif);

}。减去{

list-style-image:URL(img/MINUS . gif);

}

/风格

javascript,javascript

script src=' js/jquery-1 . 11 . 0 . js ' type=' text/JavaScript ' charset=' utf-8 '/script

脚本类型='文本/javascript '

$(function () {

//用ul给li添加一个图标(添加类名)

$('li:has(ul)')。addClass('plus ')

//添加一个点击事件。点击(功能(e) {

//查看直接点击的li(事件源)是否有子元素。

if ($(e.target)。孩子()。长度){

$(这个)。孩子()。slide toggle();

$(这个)。toggle class(' MINUS ');

}

e .停止传播();//防止事件冒泡,以便仅激活当前层。

});

});

/脚本

实现了简单的下拉菜单。

这就是本文的全部内容。希望对大家的学习有帮助,支持我们。

郑重声明:本文由网友发布,不代表盛行IT的观点,版权归原作者所有,仅为传播更多信息之目的,如有侵权请联系,我们将第一时间修改或删除,多谢。

相关文章阅读

  • 使用jquery实现图片轮播效果如何,jQuery图片轮播
  • 使用jquery实现图片轮播效果如何,jQuery图片轮播,使用jQuery实现图片轮播效果
  • 举例说明jquery中each函数的使用,jquery each()
  • 举例说明jquery中each函数的使用,jquery each(),JQuery中each()的使用方法说明
  • 一篇文章带你了解jquery动画人物,一篇文章带你了解jquery动画制作
  • 一篇文章带你了解jquery动画人物,jquery的动画,一篇文章带你了解jQuery动画
  • trigger的用法总结,jquery trigger 传参数
  • trigger的用法总结,jquery trigger 传参数,jQuery中值得注意的trigger方法浅析
  • js hover 触发事件显示另一元素,js hover 触发事件,jQuery中多个元素的Hover事件解决方案
  • js apply 实现原理,jquery apply用法_1
  • js apply 实现原理,jquery apply用法
  • js apply 实现原理,jquery apply用法,js中apply方法的使用详细解析
  • js apply 实现原理,jquery apply用法,JS中apply()的应用实例分析
  • jq获取radio选中的值,jquery radio 取值
  • jq获取radio选中的值,jquery radio 取值,Jquery获取radio选中值实例总结
  • 留言与评论(共有 条评论)
       
    验证码: