JS 解决图片太大溢出问题、CSS 限制图片最大宽度、图片按比例自动缩放

内容摘要
这篇文章主要为大家详细介绍了JS 解决图片太大溢出问题、CSS 限制图片最大宽度、图片按比例自动缩放，具有一定的参考价值，可以用来参考一下。

实现思路很简单，改造js代码，既然
文章正文

这篇文章主要为大家详细介绍了JS 解决图片太大溢出问题、CSS 限制图片最大宽度、图片按比例自动缩放，具有一定的参考价值，可以用来参考一下。

实现思路很简单，改造js代码，既然图片很大，那么我们先用最经典的限制width的方法限制大图的宽度，但是小图怎么办？小图我们用onload的方法再缩小，就这么搞定了。完美代码如下,经测试代码如下：
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<code class="js">
<script language="JavaScript">
<!--
var flag=false;
function DrawImage(ImgD){
var image=new Image();
image.src=ImgD.src;
   if(image.width>0 && image.height>0){
   flag=true;
   if(image.width>650){
   }else{
   ImgD.width=image.width;
   ImgD.height=image.height;
   }
   }
}
//-->
</script>
 
// 来自：php教程（www.idcnote.com）
</code>
对应的HTML代码：
1
2
<code class="html">
<img border=0 src="图片路径" onl oad="javascript:DrawImage(this);" width="650" /></code>

注：关于JS 解决图片太大溢出问题、CSS 限制图片最大宽度、图片按比例自动缩放的内容就先介绍到这里，更多相关文章的可以留意
代码注释
上一篇PHP 通过Email发送错误的解决办法下一篇PHP 实现图片上传并生成缩略图示例

作者：喵哥笔记

IDC笔记

学的不仅是技术，更是梦想！