根据屏幕大小从数据库中获取不同的图像

Posted 2023-02-24

【中文标题】根据屏幕大小从数据库中获取不同的图像

【英文标题】：Get a different image from the database depending on screen size

【发布时间】：2011-11-09 00:01:46

【问题描述】：

我开始制作一个网络应用程序，其想法是根据 url 从数据库中加载不同的文本和图像来访问它。 www.mitdomæne.dk/?id=1 0.2 0.3 等最多 50 件。

现在的问题是我必须让动态内容根据移动设备或平板电脑（屏幕尺寸）自行关闭。

我可以让 php 选择什么尺寸的屏幕并回显正确的图片吗？

因此，如果是 iphone 看侧面，则加载 320px 宽的图像，如果是 ipad，则为 1024px 宽。

我已经使用这些字段创建了 mysql 的日期库。

身份证： 公司： Billed_fil

代码看起来像这样。

html:

 <div data-role="page" id="side1">
   <div data-role="header" data-nobackbtn="true"> </ div>
   <div data-role="content">
     <p class="brod"> <? php echo $ company?> </ p>
 <div id="billede"> <img src = "<? php echo $ billed_fil?>" alt = "" border = "0" /> </ div>
   </ div>
   <div data-role="footer"> </ div>
 </ div>

PHP：

 <? php

 include 'firmaer_db_cnx.inc.php';

 $ id = $ _GET ['id'];
     $ sql = mysql_query ("SELECT * FROM info_int WHERE id = '$ id'");

     $ company list = mysql_fetch_array ($ sql);

     $ id = $ company list ['id'];
     $ company = $ company list ['company'];
     $ billed_fil = $ company list ['billed_fil'];

 ?>

Sql 版本 5.1.53 PHP版本 5.3.4

有可能吗？

//卡斯帕

【参考方案1】：

只需将图像存储在数据库之外就可以做这样的事情

<script language="javascript" type="text/javascript">
if(screen.width==800 && screen.height==600)
document.images['id'].src='<? php echo $ billed_fil?>-800x600.gif';

else if(screen.width==1024 && screen.height==768)
document.images['id'].src='<? php echo $ billed_fil?>-1024x768.gif';

else
document.images['id'].src='<? php echo $ billed_fil?>-default.gif'; 

</script>

【参考方案2】：

可能有一种更简单的方法来做到这一点，只使用 CSS。看看这个演示：

http://www.alistapart.com/d/responsive-web-design/ex/ex-site-larger.html 提示：调整浏览器窗口大小。

这里是Article 解释如何做到这一点。还有一些background info。

【参考方案3】：

PHP 在提供给客户端浏览器之前在服务器上运行，因此它不知道客户端浏览器运行的屏幕大小。您可能执行此操作的一种方法是通过 JavaScript 检索屏幕大小并将这些值传递给 PHP（通过 AJAX 调用？）。当然，其他 SO 人会提出其他想法（可能比我的更好），所以你可以选择如何去做。

【参考方案4】：

获取屏幕大小的唯一可能方法是通过 javascript 或一些熟悉的前端编程语言，您可以使用 ajax 调用，将其保存到 cookie，然后使用 php 读取，或者您可以更聪明一点，然后保存具有相同名称的图像，结尾有一个差异......这将是分辨率， 例如 iamge1024x123.png 然后使用 javascript onload 根据分辨率添加正确的图像。然后你保存对数据库的不必要的调用，并且在你使用它时会得到一点性能提升。我希望你能理解我的想法，这是为了一些帮助