Angular Bootstrap折叠导航栏对移动视口无响应

时间:2016-11-26 22:56:01

标签: responsive-design angular-ui-bootstrap angular-ui

我正在开发一个需要在移动浏览器上看起来很好的MEAN应用程序。起初我尝试并且未能使用Bootstrap来实现响应,因为我没有意识到Angular在Bootstrap所依赖的Bootstrap和JQuery JS库上发生了冲突。

所以我在GitHub上找到了Angular-UI项目...对不起链接,但我没有足够的声誉。

我试图让Collapse Navbar在移动设备上做出响应。 (响应意味着它会调整到"汉堡菜单"并且链接的名称不再出现在菜单中)

我未能在Node应用程序的范围内使其工作。

为了解决这个问题,我从Angular-UI Bootstrap示例引用的plunker中获取了HTML和JS(顺便提一下,当从iPhone或Samsung Edge查看时,它显示对小显示的响应)并被剥离节点应用程序,它基本上返回了Plnkr示例中的内容,但从手机浏览器查看时仍然没有响应(我测试了移动Chrome,Safari和Firefox)

在OpenShift云上查看示例应用程序的屏幕截图:

http://angbootstrapnotresponsive-215api.rhcloud.com/assets/

This sample is not responsive

注意:如果我在"响应"中查看我的样本在开发工具中使用模式,或者只是调整桌面浏览器窗口的大小,菜单链接可以根据需要折叠到汉堡包菜单中。只有当我尝试从iPhone 6或Samsung Edge使用移动浏览器时,这个响应式Navbar才没有响应。

提前感谢任何想法!

0 个答案:

没有答案