问题描述
我想在小型设备上更改Twitter Bootstrap菜单的行为,通过点击菜单项或单击菜单按钮关闭扩展菜单。目前(默认)我只能通过点击右上角的菜单按钮来折叠它,无论是否点击了链接/菜单项。我该怎么办?我无法从TB文件中找出结果,搜索互联网没有提供任何答案。
I want to change the behaviour of the Twitter Bootstrap Menu on small devices to close the expanded menu by either clicking on a menu item or clicking the menu button. Currently (default) I can only collapse it by clicking the menu button in the top right corner, no matter if I'd clicked on a link/menu item or not. How would I do that? I coudln't figure it out from the TB documentation and searching the internet didn't provide any answers.
推荐答案
感谢您的修复Skelly它在移动菜单上工作得很好,但不幸的是,它导致桌面模式的视觉缺陷,因为它是以.nav-collapse为目标,并且这个类在两种模式中都是活动的。所以,我做了一个修改:
Thanks for the fix Skelly. It worked great on the "mobile" menu, but unfortunately it was causing a visual defect in "desktop" mode as it was targeting .nav-collapse, and this class is active in both modes. So, I made a slight modification:
$('.nav li a').on('click',function(){
$('.navbar-collapse.in').collapse('hide');
})
此修改仅在菜单处于移动模式时才调用隐藏功能。
This modification will only invoke the 'hide' functionality when the menu is in "mobile" mode.
注意:这只是在Bootstrap 3上测试。
Note: This is only tested on Bootstrap 3.
这篇关于Twitter Bootstrap响应菜单/小设备:点击菜单项目的关闭/折叠菜单的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!