根据屏幕分辨率显示内容

我有一个包含一些内容的网站。根据用户屏幕分辨率我想显示不同的内容，以便移动设备将有一些其他内容，但网站的其余部分将是相同的。我做了一些研究，似乎唯一可能的方式是使用javascript。我大部分时间都是用PHP编写代码，所以我非常喜欢javascript，所以如果有人能够给我一个简单的脚本，那将会很好。根据屏幕分辨率显示内容

我需要的是像这样的javascript函数：

if (screen resolution < X x X) { 
show some content... 
} else { 
show some other content ... 
}

如果JavaScript被关闭，它应该只是显示一些其他内容.. :)我可以安装jQuery的，如果有帮助。谢谢

这将是很好的HTML代码的例子。

来源

2011-09-01 2by

一个相同的问题被问大约5小时前。自从我失败后，我确定有其他人可以找到它。 – Layke

你不应该检测用户是否在使用javascript的移动设备上。我推荐你使用PHP。你可以使用[$ _SERVER 'HTTP_USER_AGENT']，然后简单地解析出字符串来查看它是什么类型的用户代理。我现在实际上正在实施这个相同的概念。

你也可以使用这个类Mobile Detect

include("Mobile_Detect.php"); 
$detect = new Mobile_Detect(); 

if ($detect->isMobile()) { 
    // any mobile platform 
}

来源

2011-09-01 00:08:04

听起来像是一个好主意，我担心的是我需要用移动用户代理做一个该死的长列表，或者有一种智能的检测方式这个？ – 2by

所以我发现这个方便的PHP脚本http：// detectmobilebrowsers。mobi/ – 2by

您可以使用preg匹配并查找关键词，如iphone，ipod和andriod。或者使用这个类。 http://code.google.com/p/php-mobile-detect/ –

你应该尝试CSS媒体查询，而不是

来源

2011-09-01 00:02:52 szajmon

你有什么例子吗？ – 2by

在不从PHP知道，但在.net中，你可以有点检测，他们是移动访客，那么你可以将其重定向到网站的移动部分。

然后，你真正需要做的就是编写小网站重新使用你现有的网络控制等。再次，不确定你是否有这个概念在PHP中，但我想你会。

来源

2011-09-01 00:04:04 griegs

我也不知道，但这可能是一个解决方案。现在我想保持相同的网站/设计，但只是一些视频应该不同于移动设备 – 2by

啊好的。如果该网站很小，那么是的这个解决方案可能会过度杀伤 – griegs

您可以使用CSS媒体查询来定位不同的屏幕分辨率。例如：

@media only screen and (max-device-width: 1024px) and (orientation: landscape) { 
    /* iPad in landscape orientation css */ 
} 
@media only screen and (max-device-width: 480px{ 
    /* iPhone css */ 
}

更多信息： http://mislav.uniqpath.com/2010/04/targeted-css/ http://webdesignerwall.com/tutorials/css3-media-queries

来源

2011-09-01 00:05:34 marissajmc

谢谢，这可能会有用一段时间。现在我需要更改一些html内容，我不认为我可以用CSS做这个 – 2by

退房CSS的规则。它们允许您为CSS规则的“名称空间”指定最大宽度和最小宽度，在其中您可以对较小的屏幕拥有不同的规则。但使用这些时要小心，因为IE不喜欢支持好东西。

@media screen, projection and (max-device-width: 800px) {} 
@media screen and (max-device-width: 300px) {}

一个项目我工作，我们实际上重定向到页面的移动版本，如果用户代理包含特定关键字（签出JS的HTTP头），并完全使用不同的样式表。

来源

2011-09-01 00:07:04 Art

根据屏幕分辨率显示内容

回答

相关问题