首页 jquery下拉菜单求助

jquery下拉菜单求助

发布时间：2024-06-04 16:33:02 编辑：手游帝浏览：144

那是因为你离开的时候就马上调用了$(".u_ddl").hide()当然会马上消失了，开个定时器让他延时消失就可以了

$(document).ready(function(){

var timer=null//定义一个定时器变量

$(".u_menu_setting").mouseover(function(){

clearTimeout(timer)

$(".u_ddl").show()

})

$(".u_menu_setting").mouseout(function(){

timer=setTimeout(function(){

$(".u_ddl").hide()

},300)

})

$$(".u_ddl").mouseout(function(){

timer=setTimeout(function(){

$(".u_ddl").hide()

},300)

})

$(".u_ddl").mouseover(function(){

clearTimeout(timer)

$(".u_ddl").show()

})

jquery下拉菜单怎么做，一个简单的纯手写例子

你说的是类似级联菜单那种吗？如果IE8、火狐等其他浏览器正常，这个的原因可能有几个：

1、如果你用的onmouseout事件，建议你换成onmouseleave试试，因为存在事件冒泡的问题。

2、如果存在子菜单，在子菜单上面也bind一个onmouseenter和onmouseleave事件。

参考：

$("#div_Exa

a").mouseover(function

()

{

$(this).parent().children("ul").slideDown(100)

$(this).parent().siblings().children("ul").hide(100)

}).mouseleave(function

()

{

var

selector_Sub_Menu

$(this).parent().children("ul")

selector_Sub_Menu.hide()

selector_Sub_Menu.bind("mouseover",

function

()

{

selector_Sub_Menu.show()

})

.bind("mouseleave",

function

()

{

selector_Sub_Menu.hide()

})

})希望可以帮到你。

请教jQuery高手，写下拉菜单，怎么控制二级菜单出现与消失

slideDown(),slideUp()

事件就用mouseenter mouseleave

&lt!DOCTYPE html&gt

&lthtml&gt

&lthead&gt

&ltmeta charset="UTF-8"&gt

&lttitle&gt&lt/title&gt

&ltstyle type="text/css"&gt

* {

margin: 0

padding: 0

}

ul {

list-style: none

}

.wrap {

width: 330px

height: 30px

margin: 100px auto 0

padding-left: 10px

background-image: url(imgs/bg.jpg)

}

.wrap li{

background-image: url(imgs/libg.jpg)

}

.wrap &gt ul &gt li {

float: left

margin-right: 10px

position: relative

}

.wrap a {

display: block

height: 30px

width: 100px

text-decoration: none

color: #000

line-height: 30px

text-align: center

}

.wrap li ul {

position: absolute

top: 30px

display: none

}

&lt/style&gt

&ltscript src="jq.js"&gt&lt/script&gt

&ltscript type="text/javascript"&gt

$(function(){

// 分析思路:将鼠标到任何一个li上面让对应的li里面的ul 显示让其他的 li里面的ul隐藏

// 1 给所有的.wrap&gtul&gtli 添加注册鼠标移上事件 mouseover

$(".wrap&gtul&gtli").mouseover(function(){

// 2 让它里面的直接子元素ul 去滑入

$(this).children("ul").stop().slideDown()

})

//2 给所有的.wrap&gtul&gtli 添加注册鼠标移出事件 mouseout

$(".wrap&gtul&gtli").mouseout(function(){

// 2 让它里面的直接子元素ul 去滑出

$(this).children("ul").stop().slideUp()

})

&lt/script&gt

&lt/head&gt

&ltbody&gt

&ltdiv &gt

&ltul&gt

&ltli&gt

&lta href="javascript:" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" &gt一级菜单1&lt/a&gt

&ltul &gt

&ltli&gt

&lt/li&gt

&ltli&gt

&lt/li&gt

&ltli&gt

&lt/li&gt

&lt/ul&gt

&lt/li&gt

&ltli&gt

&ltul&gt

&ltli&gt

&lt/li&gt

&ltli&gt

&lt/li&gt

&ltli&gt

&lt/li&gt

&lt/ul&gt

&lt/li&gt

&ltli&gt

&ltul&gt

&ltli&gt

&lt/li&gt

&ltli&gt

&lt/li&gt

&ltli&gt

&lt/li&gt

&lt/ul&gt

&lt/li&gt

&lt/ul&gt

&lt/div&gt

&lt/body&gt

&lt/html&gt

$(document).ready(function(){

init()

})

function

init(){

$("#Menu&gtul&gtli").hover(

function(){

$(this).children("ul").fadeIn("fast")

function(){

$(this).children("ul").fadeOut("fast")

}

)

}

还需要强调的是，二级菜单的距离不要离一级导航有缝隙，否则会点不到二级菜单的。这个就是二级菜单的样式的问题了～

以上就是关于jquery下拉菜单求助全部的内容，如果了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！

jquery下拉菜单求助

jquery下拉菜单怎么做，一个简单的纯手写例子

请教jQuery高手，写下拉菜单，怎么控制二级菜单出现与消失

更多相关资讯

手游下载

应用软件