使用 jQuery Mobile 时在加载时重置 css答案

【问题标题】：Resetting css on load when using jQuery Mobile使用 jQuery Mobile 时在加载时重置 css
【发布时间】：2015-03-11 15:21:03
【问题描述】：

我在响应式网站上使用 jQuery Mobile，主要用于弹出菜单。我注意到，使用这个库，您会自动在整个站点中获取动画等内容。

缺点是我对不同的页面有特殊的样式。假设我输入了一个链接去“bio”页面，一切都很好，“roster”和“about”页面也是如此。但是，当我尝试转到另一个页面时（例如，通过使用网站的菜单从“bio”到“about”），当前页面会保留上一页的样式，只是换出 html 内容。

我如何继续使用 jQuery mobile，但让每个页面都按预期加载样式并（如果可能）保持过渡？

这里是实际页面的链接，因此您可以理解我在说什么；

http://ramiroproductions.businesscatalyst.com/roster.html - Roster
http://ramiroproductions.businesscatalyst.com/aboutus.html - About
http://ramiroproductions.businesscatalyst.com/biography.html - Bio

您可以尝试刷新它们以了解它们的外观。

【问题讨论】：

标签： javascript jquery html css jquery-mobile

【解决方案1】：

确保在 jquery mobile css 之后包含用户编写的样式，以遵循样式声明的级联规则和特异性。因此，首先尝试在 jquery 移动 css 样式表之后放置指向您的样式表的链接。如果仅此一项不起作用，请使用浏览器检查器检查哪些样式被覆盖，并将这些样式完全以该格式写入您的样式表。

【讨论】：

那行不通。我可以通过禁用 Ajax 来做到这一点。

【解决方案2】：

我发现这是因为 jQuery mobile 通过 ajax 处理链接。禁用它可以解决此问题，但您会丢失页面转换。

有关更多信息，请参阅此问题： How To Disable Ajax In jQuery Mobile Before Page Load?

【讨论】：