jQuery Mobile和HTML5 Boilerplate

时间:2012-01-06 17:01:07

标签: jquery-mobile html5boilerplate

是否有人知道如何在具有特定屏幕分辨率的网页上加载jQuery Mobile?如果有人从台式机/笔记本电脑浏览器查看页面,我不想加载jQuery Mobile,因为我想使用HTML5 Boilerplate。

例如,如果有人从他的iPhone访问我的页面,我希望jQuery Mobile使用我创建的主题格式化网站,但是如果他们从他们的桌面查看它,我不希望jQuery Mobile添加所有额外的标签和东西。

由于

3 个答案:

答案 0 :(得分:4)

<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>

答案 1 :(得分:1)

<script type="text/javascript">
    <!--
    if (screen.width <= 699) {
    document.location = "mobile/index.html";
    }
    //-->
</script>

这段脚本将识别屏幕大小,在这种情况下为699像素,然后告诉服务器加载与根不同的文件夹。只需在您的服务器上为您的jquery移动网站创建一个名为mobile的文件夹即可。干杯!

答案 2 :(得分:0)

jQM文档:

  

注意:此功能在测试版中已弃用,已在1.0rc1中删除。我们   建议使用CSS3 Media Queries。支持旧版本   在Internet Explorer中,查看respond.js,快速&amp;轻量级   polyfill for min / max-width CSS3 Media Queries。

     

如果您仍然需要此功能,可以在此处找到代码:   jquery.mobile.media.classes.js