0

如果检测到移动设备或分辨率低于 641 像素，是否可以加载 div？我有不同的桌面和移动菜单。移动菜单使用图像 svg sprite，但对于桌面，我不希望加载该 svg 图像以保存 HTTP 请求。我可以根据媒体查询隐藏 div，但我怎样才能至少防止图像被加载，或者仅为移动设备加载内部菜单 div？最好的方法是什么？

4

3 回答 3

2

您可以防止图像在某些条件下被加载

$(document).ready( function() { 
  if(yourCondition){
    $("img").removeAttr("src");
  }
 });
于 2013-04-09T10:48:14.150 回答
1

https://code.google.com/p/php-mobile-detect/wiki/Mobile_Detect

检查上面的链接，您可以在 if else 语句中使用它来根据设备类型显示隐藏 div

<?php
// Written By Adam Khoury @ developphp.com - March 26, 2010
// PHP swapping CSS style sheets for target device layouts
// Make your index page of your site a .php file instead of .html
 $styleSheet = "default.css";
$agent = $_SERVER['HTTP_USER_AGENT']; // Put browser name into local variable

if (preg_match("/iPhone/", $agent)) { // Apple iPhone Device
// Set style sheet variable value to target your iPhone style sheet
   $styleSheet = "iphone.css";

} else if (preg_match("/android/", $agent)) { // Google Device using Android OS
// Set style sheet variable value to target your Android style sheet
$styleSheet = "android.css";

}
?>

以上代码仅取自http://www.developphp.com/view_lesson.php?v=310，如果需要，请查看完整代码。

于 2013-04-09T10:44:33.343 回答
0

如果您最大的问题是在不需要时阻止加载某些图像，我建议您继续使用媒体查询。如果您加载不同的 css 文件（取决于媒体），您可以将所需的图像添加为“背景图像：”。这也适用于 SVG Site。

如何在保持纵横比和可伸缩性的同时使用 SVG Sprite Sheet 作为 CSS 背景图像

于 2013-04-09T12:04:27.433 回答