在整个jQuery Mobile文档中，他们使用左侧菜单进行导航，当浏览器宽度较小时，该菜单会更改为更适合移动设备的版本。您可以在this page.
上查看示例他们在整个文档中使用此布局，我可以在源代码中看到他们使用ID为“content-primary”和“content-secondary”的两个div。我的问题涉及这样一个事实，即我无法找到文档中实际讨论的这种结构。他们似乎不会在框架中包含这样一个有用的小部件，这似乎很奇怪。他们是否使用自定义代码来实现这一目标，还是我在文档中以某种方式错过了它？
答案 0 :(得分：0)
实际上这不是jquery mobile特有的，这是CSS3。您可以在此处查看文档：{{3}}。基本上他们所做的是使用媒体查询为不同的屏幕宽度指定样式规则，如下例所示：
@media all and (min-width: 650px) { // you can define your width here
// style rules here
}
答案 1 :(得分：0)
我很惊讶地发现，在JQM中找到一个能够始终如一地工作的左导航示例是多么具有挑战性。
我直接从JQM文档中复制代码，包括抓取他们的自定义.js和.css脚本（定义{{1}}和.content-primary类，以及各种{{1} }使菜单响应的查询。）
JQM文档不使用“多页”格式。相反，每个导航菜单项链接到一个完全独立的URL（可能通过向链接添加.content-secondary来预取到DOM中），因此每个新页面/ URL必须重新定义相同的导航菜单。
这立即让我的开发人员大脑“让我们抽象菜单并自动将其包含在每个页面上”。但如何在没有PHP（或其他服务器端语言）的情况下在每个页面上“包含”菜单？这是我还没有解决的问题。
您可以使用javascript / jquery调用@media函数手动将菜单注入加载页面，但我还没有弄清楚如何正确执行此操作。
如果/当我有一个可行的解决方案时，我会告诉你。
答案 2 :(得分：0)
你在谈论http://jquerymobile.com/demos/1.3.0-beta.1/docs/demos/panels/panel-nav-form.html#左侧菜单吗？没玩过它但看起来好像这几天只需要
<div data-role="panel" data-position="left" data-position-fixed="false" data-display="reveal">