带有useragent变量的Javascript条件_Javascript_User Agent_Conditional Statements

带有useragent变量的Javascript条件

javascript

带有useragent变量的Javascript条件,javascript,user-agent,conditional-statements,Javascript,User Agent,Conditional Statements,我需要帮助写一个条件与javascript的2个视频。我四处搜索过，但我想我对如何设置变量感到困惑。我有一个视频（flash iframe），我想在桌面浏览器的站点上显示，但我想在移动设备上查看站点时显示另一个视频（非flash）以下是两个视频： <html> <div id="desktop_video"> <iframe src="url-here" height="650" width="600" frameborder="no" s

我需要帮助写一个条件与javascript的2个视频。我四处搜索过，但我想我对如何设置变量感到困惑。我有一个视频（flash iframe），我想在桌面浏览器的站点上显示，但我想在移动设备上查看站点时显示另一个视频（非flash）

以下是两个视频：

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

比方说，如果您试图以480px的最小浏览器宽度显示桌面，这将是您的CSS：

#mobile_video {
    display: none;
}

#desktop_video {
    display: block;
}

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

虽然桌面应该已经被阻塞了，但我在代码中添加了一些代码，以明确这是必要的。这只是一种简单的方法。

您可以使用

Navigator.useragent

来检测客户端的浏览器。（如果您进行搜索，将有大量资源。）

我从下面这行代码中选择了检查用户是否正在使用移动设备

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

，则可以显示移动视频（非flash）。或者，您可以只显示iframe视频

希望这能帮助你开始。正如我所提到的，有很多资源可以帮助您解决这个问题，即使如此

我喜欢这种方法。然而，在我的iPad上，它对我不起作用。手机视频未显示，我仍在接收Flash错误消息。有什么见解吗？我以为你已经设置好了其余的：）试着把这个添加到你的标题中：还要确保你把iPad的大小插入css最大宽度：768px（我相信）。阅读这里了解更多信息：现在iPad没有调用桌面视频，所以没有得到闪光错误，这是好的。但它仍然没有调用移动视频，它只是一片空白。明天早上我得再谈这个问题。谢谢你的帮助！