只在特定浏览器宽度的任意位置单击即可自动关闭菜单

Question

我制作了一个简单的jsfiddle来展示这个问题：
http://jsfiddle.net/jacqueline01/rCW85/

请调整浏览器大小以查看下拉/切换菜单。这个简化的小提琴是根据本教程创建的。

问题
当下拉/切换菜单可见时，每当我单击链接或在菜单外单击时，我希望它自动关闭。只有当浏览器宽度小于500px时，才会发生这种情况。（见小提琴）

我尝试添加以下内容：

$("html").click(function() {
    // Code to slideUp the .menu-items
});

然而，当浏览器宽度超过500px时，这个函数当然也能工作。我无法在<500px JS代码。

因此，我正在寻找一种方法，在移动菜单可见后，点击HTML中的任何位置，向上滑动菜单。

任何帮助都是值得的。提前感谢！

Answer 1

试试简单的css菜单，jsfiddle.net/rCW85/10更好（请查看外部资源部分的css。在micjamking.github.io/Navigataur上演示。您只需要将媒体查询的宽度更改为500

如果你想在用户点击外部时关闭菜单，请尝试这个jsfiddle.net/aamir/rCW85/11