2

我已经为我的网站制作了响应式版本 我对图像（或网站大小）有疑问。在“pc”版本中，我有图像，比如说设计图像。

在移动版本中，我设置为这个元素显示：无，我不需要在我的移动版本中有这个图形的东西。

当我在 PC 浏览器（Firefox、Chrome）中的小窗口（比如说 500px 宽）中打开页面时，我看到的一切都像在手机中一样出色。当我查看开发工具时，我看到所有图像（包括图像有显示：无或背景：此分辨率无）已下载。

问题：是否可以仅下载此分辨率所需的图像？当我更改窗口大小时，其他图像将开始下载（这不是正常的用户行为，普通用户有任何大小的窗口/视口，并且在查看网站期间不要更改它。当他们尝试时，如有必要，他们会等待一些新图像）？

谢谢。

4

1 回答 1

0

看看这个 PHP 类。由于您的页面已被解析并从您的服务器完整发送到桌面，因此您的 PHP 可以过滤出移动设备是否正在查看该页面并阻止发送不需要的代码（以及随后通过该代码加载的对象 - 例如图像）。

此页面有一组很好的示例/用例，让您了解如何构建代码。

PHP 真实世界示例

<?php
  include 'Mobile_Detect.php';
  $device = new Mobile_Detect;
  if ($device->isMobile()) {
    $images = FALSE;
  }
?>

^这是在所有页面访问的包含文件中

<article>
  <header>
    <section id="author-name">
      <?php print $author_name ?>
    </section>
    <section id="author-img">
      <?php if($images): ?><img src="http://example.com/image.jpg" /><? endif; ?>
    </section>
  </header>
  <content class="article">
    <?php if($images): ?><img src="http://example.com/article1.png" class="article" /><? endif; ?>
    <h2 class="title article">Article Title</h2>
    <p class="content article">Blah blah blah blah blah article stuff</p>
  </content>
</article>
于 2013-10-26T09:55:49.957 回答