Question

我有一个resposive网站，可以在桌面上正常使用，但不能在移动设备和平板电脑视图中使用。导航栏中的菜单未显示在“移动设备和平板电脑视图”

中

您可以点击此处的链接查看屏幕截图：https://dl.dropboxusercontent.com/s/866bi2l7oho5w6y/prob1.JPG

这是我的网站：http://www.sociolife.co.in/

PS：导航栏显示在平板电脑和移动视图中，但菜单未显示。

您能否告诉我问题出在哪里？我该如何解决？

Answer 1

您有media-query将#menu-main设置为display: none的窗口小于1024px

从你的CSS中删除这一行，一切正常：

@media only screen and (max-width: 1028px)
#menu-main {
  display: none;
}

//编辑没有你没有删除它，否则它会是这样的： http://imgur.com/XX2SlfG

//编辑2 现在好了，我明白了。他们实施了第二个导航，这是一个选择框。这就是为什么tey隐藏移动中的#menu-main并显示#tinynav1。也许您应该将此链接添加到您的问题中，否则没有人知道您想要实现的目标。

selecbox看起来像这样：

<select id="tinynav1" class="tinynav tinynav1">
    <option>Navigation</option>
    <option>your options</option>
    ....
</select>

但我想这是一个来自他们页面的JS插件，我不知道你是否有这个插件。否则请谷歌：

 $("#menu-main").tinyNav({
    active: 'selected', // String: Set the "active" class
    header: 'Navigation', // String: Specify text for "header" and show header instead of the active item
    label: '' 
});

http://tinynav.viljamis.com/＆lt; - js library

导航视图中未显示导航栏菜单

1 个答案: