调整大小时出现渲染问题

Question

我正在使用bootstrap 3.3.7，并使用标准的bootstrap类创建菜单。 我已经对其进行了重新样式设置，以便将颜色设置为带有紫色底色的白色。 最初加载页面时，一切都很好。 当我用鼠标减小屏幕宽度时，菜单开始按预期折叠，但菜单似乎消失了。 如果我停止减小屏幕尺寸，然后将鼠标移至菜单应位于的位置，则它将重新显示。 因此，该操作有效，菜单在移动时未保持其配色方案。 在某个地方错过了花样吗？

如果将屏幕尺寸调整为e 767，使菜单上出现“汉堡”按钮，则会出现相同的问题。 我单击了汉堡包，直到将鼠标移到菜单左侧的屏幕左侧，似乎什么也没有显示。

Answer 1

当您用鼠标调整视口大小时，由于javaScript在该调整大小上起作用，因此最终结果不会总是正确显示。

尝试仅使用给定的特定窗口大小：Ipad Pro，Ipad等。选择后，使用CTRL + F5或CTRL + SHIFT + R进行硬刷新，然后告诉我问题是否仍然存在。

另外，请从引导程序检查内置样式，当您在平板电脑或移动设备上使用时，它可能会更改。

Answer 2

codepen.io/bilpor/pen/gjRQgj

因此，在查看代码笔后，这就是桌面结果。 这是我将鼠标悬停在其上之前的菜单。

这是我将鼠标悬停在元素上之后的图像。

关于您的问题，请使用JavaScript代码仅在桌面上运行。

  $(document).ready(function () { if (screen.width < 1024) { // your code that affect navbar here } else { alert(Error!); } });