针对Mobile + CSS类的jQuery？

我目前使用下面从包含.iframe-NAV某些页面针对Mobile + CSS类的jQuery？

$(document).ready(function() { 
if($(".iframe-nav").length > 0) // If .iframe-nav exists 
    $("#main-header").hide(); // Hide #main-header 
});

删除我的头这个伟大的工程。我的问题是，我有其他页面包含“.iframe1”，不受该脚本的影响，并且因为在移动设备上显示不正确。我需要两个单独的CSS类，原因是我现在不会进入。

有没有办法从包含.iframe1网页，以及从我的移动网站@mobile只有屏幕上删除＃主标题和（最大宽度：767px）？

我尝试了以下测试从所有移动页面（作为测试）中删除#main-header，但未成功。我还有很多东西需要学习...... 没有工作：

$(document).ready(function() { 
if (matchMedia('only screen and (max-width: 767px)').matches) { 
    $("#main-header").hide(); // Hide #main-header 
}

非常感谢提前。

来源

2015-10-06 SnaFubar

你怎么测试呢？你使用的是桌面浏览器，只是调整窗口大小？另外http://caniuse.com/#search=matchMedia只是IE10 +你在IE9中测试吗？ – NullHappens

我在iPhone上使用Safari来测试这些移动卡住。通常用于桌面测试的Chrome或Safari。（osx） – SnaFubar

我会建议把你的逻辑到$(window).on("resize"块如下：

$(window).on("resize", function (e) { 
    var newWindowWidth = $(window).width(); 
    if(newWindowWidth < 767) //check for width 
    { 
     $("#main-header").hide(); 
    } 
});

来源

2015-10-06 04:50:46 vijayP

嘿@vijayP，你的解决方案让我在那里分道扬part。但我遇到两个问题： 1-我仍然需要在脚本中额外定位.iframe1类，以便仅阻止具有该类的页面在移动设备上显示导航。 2-脚本正在成功从移动网站中删除#main-header，但只有在滚动已激活之后。这可能与我的wordpress高级主题的响应式断点有关。如果你认为你可以帮助这个，我可以PM你我的CSS等任何额外的帮助将不胜感激，谢谢！ – SnaFubar

针对Mobile + CSS类的jQuery？

回答

相关问题