JS按比例缩放图片
1、JS代码
<script type="text/javascript" language="javascript">
var flag = false;
function DrawImage3(iwidth,iheight,ImgD) {
var image = new Image();
image.src = ImgD.src;
if (image.width > && image.height > ) {
flag = true;
//原图宽除高的值和定义宽除高的值的比较
if (image.width / image.height >= iwidth / iheight) {
// 原图的宽大于定义的宽
if (image.width > iwidth) {
ImgD.width = iwidth;
//定义的宽度和原图的宽度的比例,同比缩小高度
ImgD.height = (image.height * iwidth) / image.width;
} else {
ImgD.width = image.width;
ImgD.height = image.height;
}
ImgD.alt = image.width + "×" + image.height;
}
else {
// 原图的高大于定义的高
if (image.height > iheight) {
ImgD.height = iheight;
//定义的高度和原图的高度的比例,同比缩小宽度
ImgD.width = (image.width * iheight) / image.height;
} else {
ImgD.width = image.width;
ImgD.height = image.height;
}
ImgD.alt = image.width + "×" + image.height;
}
}
}
</script>
2、前代代码
<img alt='' src="Image/wuqilong.jpg" onload="DrawImage3(200,150,this)" />
JS按比例缩放图片的更多相关文章
- JS等比例缩放图片,限定最大宽度和最大高度
JS等比例缩放图片,限定最大宽度和最大高度 JavaScript //图片按比例缩放 var flag=false; function DrawImage(ImgD,iwidth,iheight){ ...
- js同比例缩放图片
function DrawImage(ImgD, FitWidth, FitHeight) { var image = new Image(); image.src = ImgD.src; if (i ...
- JavaScript等比例缩放图片
js等比例缩放图片,这个功能非常实用,当网页加载一个尺寸比较大的图片时,往往会把一个网页撑的变形,页面变得很难看,于是我们就想到了用JS去控制超出一定范围的图片,以稳定页面布局,本代码段就是完成了此功 ...
- JS实现等比例缩放图片
JS实现等比例缩放图片 2014-01-19 21:57 by 龙恩0707, 40 阅读, 0 评论, 收藏, 编辑 JS实现等比例缩放图片 有时候我们前端页面只有500×500像素的宽和高的布局, ...
- PHP按最大宽高等比例缩放图片类
本来用phpthumb来缩略图片是十分方便的,但是最近在sae上写项目发现phpthumb在sae上保存文件时会出问题,想来实现一个简单的按最大宽高等比例缩放图片类也并不困难,于是便自己写了一个方便修 ...
- PHP按最大宽高等比例缩放图片类 http://www.oschina.net/code/snippet_876708_21113
PHP按最大宽高等比例缩放图片类 http://www.oschina.net/code/snippet_876708_21113 php 等比例缩小图片 http://www.111cn.net/p ...
- 【Thumbnailator】java 使用Thumbnailator实现等比例缩放图片,旋转图片等【转载】
Thumbnailator概述: Thumbnailator是与Java界面流畅的缩略图生成库.它简化了通过提供一个API允许精细的缩略图生成调整生产从现有的图像文件的缩略图和图像对象的过程, ...
- C#等比例缩放图片
等比例缩放图片(C#) private Bitmap ZoomImage(Bitmap bitmap, int destHeight, int destWidth) { try { System.Dr ...
- DTCMS,添加文章时,内容中第一张图片作缩略图,并且等比例缩放图片
DTCMS,添加文章时,内容中第一张图片作缩略图 admin/article/article_edit.aspx.cs 导入: using System.Drawing;using System.Dr ...
随机推荐
- Apache Flink 整体介绍
前言 Flink 是一种流式计算框架,为什么我会接触到 Flink 呢?因为我目前在负责的是监控平台的告警部分,负责采集到的监控数据会直接往 kafka 里塞,然后告警这边需要从 kafka topi ...
- C# 十六进制转换ASCII
string s = "这里放十六进制字符串"; byte[]buff=new byte[s.Length/2]; int ind ...
- Fedora 25技巧
shell界面按F5插入-(波浪号,HOME) 同一个应用不同窗口切换alt + `
- mongo数组修改器—$push、$ne、$addtoset、$pop、$pull
这几个方法也很有意思 $push 像已有的数组末尾加入一个元素,要是元素不存在,就会创建一个新的元素,如果元素存在了,就会再添加一个一模一样的元素,会造成元素的重复,所以在使用的时候,要确保该元素不存 ...
- 多flavor导致的源码依赖问题-- Cannot choose between the following configurations of project :sample:
一.背景: 当我们在源码依赖的时候经常会导致一些问题. 我们的主工程有如下配置,它依赖了一个sample的本地工程 flavorDimensions "demo" productF ...
- matplotlib.pyplot 属性用法
import matplotlib.pyplot as plt x_values = list(range(1, 1001)) y_values = [x**2 for x in x_values] ...
- mongodb java操作常用写法
MongoDB 将数据存储为一个文档,数据结构由键值(key=>value)对组成.MongoDB 文档类似于 JSON 对象.字段值可以包含其他文档,数组及文档数组.下面介绍的是用java操作 ...
- PHP算法之电话号码的字母组合
给定一个仅包含数字 2-9 的字符串,返回所有它能表示的字母组合. 给出数字到字母的映射如下(与电话按键相同).注意 1 不对应任何字母. 示例: 输入:"23"输出:[" ...
- 使用osgearth2.9 rex引擎在Qt中黑屏的问题修复
将osgUtil::RenderStage.cpp中的下列红色代码注释重新编译即可: if ( !colorAttached ) { setDrawBuffer( GL_NONE, true ); s ...
- SpringCloud服务消费有哪几种方式?
一.使用LoadBalancerClient LoadBalancerClient接口的命名中,可以看出这是一个负载均衡客户端的抽象定义,spring提供了一个实现 org.springframewo ...