【问题标题】:How to show sliding panel ONLY in the mobile version of my website如何仅在我的网站的移动版本中显示滑动面板
【发布时间】:2013-05-12 03:28:25
【问题描述】:

您认为哪一个是仅在我的网站的移动版本中显示带有菜单的滑动面板的最优雅的解决方案。我将使用 1140px 网格构建它,并且将为桌面/iPad 版本提供常规水平导航,当它缩小到移动设备时,我想将常规导航设置为蜂巢并将其移动到此滑动面板。 我考虑过使用 jQuery Mobile,但这意味着我的整个网站都必须基于它(如果我在这里错了,请纠正我)。我一直在考虑把它放在那里,但用 CSS 隐藏起来,只为移动版本显示它。然而,这意味着用户必须下载所有内容,无论他使用什么设备。 伙计们,我们将不胜感激。

【问题讨论】:

  • 即使我不制作滑动面板,我也会使用 CSS 媒体查询,我知道它们。具体怎么做?

标签: jquery html css mobile


【解决方案1】:

将 div 设置为不定期显示,然后仅在屏幕宽度为 480 像素及以下的媒体设备上显示。

#divID {
    display:none;
}
@media only screen and (max-device-width: 480px) {
    #divID {
        display:block;
    }
}

【讨论】:

  • 哦,你需要做的是在使用边距、宽度、高度、列表样式等之前对其进行结构化,然后在媒体查询中更改所有这些。如果您不提供代码示例,我们无能为力。
猜你喜欢
  • 1970-01-01
  • 2014-11-19
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2015-11-28
  • 1970-01-01
相关资源
最近更新 更多