js和php计算图片自适应宽高算法实现
js Code:
<script> $width = $(imgobj).width(); //图原始宽 $newheight = $(imgobj).height(); //图原始高 $w = 693; //最小宽度 $h = 840; //最大宽度 //计算图片比例高度 $A=$w / $h; $A1=$width/$newheight; if($A1>$A){ $width=$w; $newheight=$w/$A1; }else if($A1<$A){ $height=$h; $width=$h*$A1; }else if($A1==$A){ $width=$w; $newheight=$h; } $width = parseInt($width);//得到的自适应宽度 $newheight = parseInt($newheight); //得到的自适应高度 </script>
说明:
设容器宽为W,高为H,则宽高比例为W/H=A;
设被加载图片宽为W',高为H',则被加载图片宽高为W'/H'=A';
设修正后的被加载图片宽为W'',高为H''。
结论:
若被加载图片相对容器更宽,更矮:
即当A' > A时,W'' = W, H'' = W / A';
若被加载图片相对容器更高,更窄:
即当A' < A时,H'' = H, W'' = H * A';
若被加载图片宽高比与容器相当:
即当A' = A时,W'' = W, H'' = H。
php Code:
// src:原图地址 // w:需要显示的宽 // h:需要显示的高 public static function imageSize_tag($src,$w,$h){ $src='img.jpg'; $w = 693; $h = 840; $src = $_SERVER['DOCUMENT_ROOT'].$src; $img = getimagesize($src); $width = $img[0]; $height = $img[1]; $A=$w / $h; $A1=$width/$height; if($A1>$A){ $width=$w; $height=$w/$A1; } else if($A1<$A){ $height=$h; $width=$h*$A1; } else if($A1==$A){ $width=$w; $height=$h; } return "<img src='$src' height='$height' width='$width' />"; }
朝朝暮暮.
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步