0

我正在编写一个适合移动设备的网页，并且是 JQuery Mobile。但是，在我的 CSS 中，我使用了许多媒体查询。这一切都很好，除非我想使用 AJAX（JQueryMobile 的 'data-ajax' 属性）加载页面。如果我这样做，则似乎没有考虑媒体查询。只有当我刷新页面时，媒体查询才会出现。

有没有人在这方面有任何经验，或者他们能说明我正在发生这种情况吗？

我在 azure 上发布了一个示例来演示。它包含一个登录表单（不需要用户名或密码 - 只需单击“登录”）。在目标 (home.html) 上有一个 div，应该使用宽度大于 767px 的媒体查询来隐藏它）。但是，当我缩小窗口大小时，它并没有隐藏。只有当我重新加载页面并调整大小时才会发生这种情况。

见这里：http ://testjquerymob.azurewebsites.net/index.html

提前致谢。

吨

4

1 回答 1

0

啊哈！

我这边非常愚蠢的错误。正如我上面提到的饥饿痛的回应，我在标签中包含了媒体查询的 CSS <style>。在将它们从包含的样式表中移出后，我认为它会解决问题。事实证明它没有。但是，我发现它在加载页面（我正在加载目标 URL 的页面）中，我应该引用包含的样式表或至少在<style>标签中添加媒体查询。

所以，总结一下——

  1. 我加载了 index.html
  2. 我想将home.html加载到其中并根据视口大小在home.html中隐藏一个 DIV 。
  3. 我应该在父页面中包含媒体查询/样式表，而不是在home.html中包含媒体查询 - index.html因为它将加载home.html的 html 内容的页面

多谢你们，

吨

于 2013-08-06T09:21:08.210 回答