Javascript条件与useragent变量

我需要帮助为2个视频编写条件与JavaScript。我已经搜索过，但我想我对如何设置我的变量感到困惑。我有一个视频（闪存iframe），我想在桌面浏览器的网站上显示，但我希望在移动设备上查看网站时显示不同的视频（非闪光灯）。Javascript条件与useragent变量

这是两个视频：

<html> 
    <div id="desktop_video"> 
     <iframe src="url-here" height="650" width="600" frameborder="no" scrolling="no" marginwidth="0px" marginheight="0px"></iframe> 
    </div> 

    <div id="mobile_video"> 
     <script type="text/javascript" src="http://url-here"></script> 
    </div> 
</html>

来源

2013-07-11 user2574654

说，你想显示在480像素的最小宽度的浏览器在桌面上，这将是你的CSS：

#mobile_video { 
    display: none; 
} 

#desktop_video { 
    display: block; 
} 

@media only screen and (max-width: 480px) { 
    #desktop_video { display: none; } 
    #mobile_video { display: block; } 
}

虽然桌面应该已经被阻止了，我加入了代码以明确它是必要的。这只是一个简单的方法来做到这一点。

来源

2013-07-12 00:29:13 Mikel

我喜欢这种方法。但是，它不适合我的iPad。移动视频不显示，我仍然收到Flash错误信息。任何见解？ – user2574654

我以为你有其余的设置:)尝试添加到您的标题：还请确保你把你的iPad的大小插入到css max-width：768px（我相信）。请阅读此处了解更多信息：http://css-tricks.com/snippets/css/media-queries-for-standard-devices/ – Mikel

现在，iPad不会在桌面视频中调用，所以不会出现Flash错误这很好。但它仍然不是在移动视频中打电话，它只是空白。我必须在早上回来。谢谢你的帮助！ – user2574654

您可以使用Navigator.useragent来检测客户端的浏览器。（有很多资源在那里，如果你搜索。）

我从javascriptkit下面一行将如果用户使用移动设备检查...

//returns true if user is using one of the following mobile browsers 
var ismobile=navigator.userAgent.match(/(iPad)|(iPhone)|(iPod)|(android)|(webOS)/i)

你可以如果ismobile返回true，则显示移动视频（非闪光灯）。否则，你可以只显示iframe视频。

希望这可以帮助你获得开始。正如我所说，有很多资源，在那里帮助您与此解决方案，即使在SO ...

How to detect a mobile device with javascript

来源

2013-07-12 00:32:08 neo108

Javascript条件与useragent变量

回答

相关问题