2015-02-17 97 views
0

当点击不在菜单上时,我已经看到了关于关闭菜单的相当多的话题,但是我的问题是,你可以简单地修改下面的代码 - 如果你不点击#menu> ul> li> removeClass打开。就像onclick!== CSS ...?通过删除课程,当点击不在菜单上时关闭菜单?

$('#cssmenu > ul > li > a').on('click', function(){ 
     $("#cssmenu ul").removeClass("open"); 
    }); 
+0

从UX的角度来看,我也会关闭菜单,当你停止它。现在,您要求用户点击某个可能会吓倒他们的网页,因为谁知道点击页面上的任何位置会发生什么情况。 – GolezTrol 2015-02-17 20:44:20

+0

@VaMoose我还没有尝试过任何东西,因为我不知道如何编写语句,如果用户没有点击这个>删除类。我只需要用上面的jQuery代码重写,如果没有点击。 – RooksStrife 2015-02-17 20:45:34

+0

悬停的好处。这部分代码不会在桌面上使用,只是移动而已。 – RooksStrife 2015-02-17 20:46:31

回答

1

会是这样的工作?:

HTML:

<div class="container"> 
<div id="cssmenu" class="open"> 
     Content goes here 
</div> 
</div> 

CSS:

.container { 
    width: 100%; 
    height: 100%; 
} 

#cssmenu { 
    width: 50px; 
    height: 50px; 
    display: inline-block; 
    background: #000; 
} 

.open { 
    background: green !important; 
} 

最后JS:

$(document).mouseup(function (e) { 
var element = $("#cssmenu"); 

if (element.has(e.target).length === 0 && !element.is(e.target)) { 
    // click outside of the element 
    element.removeClass("open"); 
} 
}); 

jsFiddle