JS等比例缩放图片,限定最大宽度和最大高度
JavaScript
//图片按比例缩放
var flag=false;
function DrawImage(ImgD,iwidth,iheight){
//参数(图片,允许的宽度,允许的高度)
var image=new Image();
image.src=ImgD.src;
if(image.width>0 && image.height>0){
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;
}
}
}
html
<img src="images/toplogo.gif" onload="javascript:DrawImage(this,100,100)">
JS等比例缩放图片,限定最大宽度和最大高度的更多相关文章
- JS按比例缩放图片
1.JS代码 <script type="text/javascript" language="javascript"> var flag = fa ...
- 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 ...
随机推荐
- jenkins配置邮件报警
author:headsen chen date: 2018-05-15 13:49:21 在jerkins的主配置页面上: 注意:不用 安装什么报警邮件的插件.直接配置就可以了. 系统管理 --- ...
- js 跨域 之 修改服务器配置-XAMPP-Apache (nginx 拉到最后!)
js高程第21章提到了ajax 跨域技术,方法有很多,如图: 我主要讲这个: 其实代码就是这样就好了,当然只兼容 IE9 及之后的版本 ,IE9 之前的版本请去原书看吧,Page 600 var xh ...
- Maven的安装配置及初次创建项目与java单元测试工具JUnit
Maven 安装 1.把maven安装包解压到某个位置 2.配置M2_HOME环境变量指向这个位置 3.在path环境变量中添加;%M2_HOME%\bin 配置镜像 国内的阿里云镜 ...
- JS实现关闭当前子窗口,刷新父窗口及调用父窗口的方法
一.js实现关闭当前子窗口,刷新父窗口 JS代码如下: <script> function refreshParent() { window.opener.location.href = ...
- HDU_5533_Dancing Stars on Me
Dancing Stars on Me Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 262144/262144 K (Java/Ot ...
- php 乘除法原理
w $wdays = ceil(($wmaxutime-$wminutime)/(24*3600)); $wdays = ceil(($wmaxutime-$wminutime)/243600); 二 ...
- SpringBoot 配置文件 YML/Profile
1. 全局配置文件 application.properties application.yml 配置文件名是固定的; 配置文件存放在src/main/resources目录或者类路径/config下 ...
- 【react npm】解决用npmstart启动别人的react项目的问题1:sha1-xxx checksum failed wanted sha1-xxx but got sha512-xxx. (10700 bytes)
1.npm是nodejs的包管理器,相当于php的composer,python的pip,用于安装各种包. 2.一般来说,别人拷给你的react项目不会带依赖包的,因为太大了,需要用npm命令自己安装 ...
- Java 输入/输出流
1. 编码问题 在介绍输入输出之前我们先介绍下关于编码的一些基本知识点.当一个文件里既有中文字符又有英文字符时.他们在不同的编码方式下会占领不同的内存: 1. ANSI 中文占领 2 个字节的内存空间 ...
- JavaWeb—Base64编码(转载)
基本概念 Base64这个术语最初是在“MIME内容传输编码规范”中提出的.Base64不是一种加密算法,虽然编码后的字符串看起来有点加密的赶脚.它实际上是一种“二进制到文本”的编码方法,它能够将给定 ...