有谁知道让 jQuery Mobile 仅在具有特定屏幕分辨率的页面上加载的方法?如果有人从桌面/笔记本电脑浏览器查看页面,我不希望加载 jQuery Mobile,因为我想使用 HTML5 样板。
例如,如果有人从他们的 iPhone 访问我的页面,我希望 jQuery Mobile 使用我创建的主题来格式化网站,但如果他们从桌面查看它,我不希望 jQuery Mobile 添加所有额外的标签和东西。
谢谢
有谁知道让 jQuery Mobile 仅在具有特定屏幕分辨率的页面上加载的方法?如果有人从桌面/笔记本电脑浏览器查看页面,我不希望加载 jQuery Mobile,因为我想使用 HTML5 样板。
例如,如果有人从他们的 iPhone 访问我的页面,我希望 jQuery Mobile 使用我创建的主题来格式化网站,但如果他们从桌面查看它,我不希望 jQuery Mobile 添加所有额外的标签和东西。
谢谢
<script type="text/javascript">
<!--
var fileref=document.createElement('script')
fileref.setAttribute("type","text/javascript")
fileref.setAttribute("src", "js/jqueryMobile.js")
if (screen.width <= 480) {
document.getElementsByTagName("head")[0].appendChild(fileref);
}
//-->
</script>
<script type="text/javascript">
<!--
if (screen.width <= 699) {
document.location = "mobile/index.html";
}
//-->
</script>
这段脚本将识别屏幕大小,在本例中为 699 像素,然后告诉服务器加载与根目录不同的文件夹。只需在您的服务器上为您的 jquery 移动站点创建一个名为 mobile 的文件夹即可。干杯!
jQM 文档:
注意:此功能在 beta 中已弃用,并在 1.0rc1 中删除。我们建议改用 CSS3 媒体查询。要支持旧版本的 Internet Explorer,请查看respond.js,这是一种用于最小/最大宽度 CSS3 媒体查询的快速且轻量级的 polyfill。
如果你仍然需要这个功能,你可以在这里找到代码: jquery.mobile.media.classes.js