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按比例缩放图片的更多相关文章

  1. JS等比例缩放图片,限定最大宽度和最大高度

    JS等比例缩放图片,限定最大宽度和最大高度 JavaScript //图片按比例缩放 var flag=false; function DrawImage(ImgD,iwidth,iheight){ ...

  2. js同比例缩放图片

    function DrawImage(ImgD, FitWidth, FitHeight) { var image = new Image(); image.src = ImgD.src; if (i ...

  3. JavaScript等比例缩放图片

    js等比例缩放图片,这个功能非常实用,当网页加载一个尺寸比较大的图片时,往往会把一个网页撑的变形,页面变得很难看,于是我们就想到了用JS去控制超出一定范围的图片,以稳定页面布局,本代码段就是完成了此功 ...

  4. JS实现等比例缩放图片

    JS实现等比例缩放图片 2014-01-19 21:57 by 龙恩0707, 40 阅读, 0 评论, 收藏, 编辑 JS实现等比例缩放图片 有时候我们前端页面只有500×500像素的宽和高的布局, ...

  5. PHP按最大宽高等比例缩放图片类

    本来用phpthumb来缩略图片是十分方便的,但是最近在sae上写项目发现phpthumb在sae上保存文件时会出问题,想来实现一个简单的按最大宽高等比例缩放图片类也并不困难,于是便自己写了一个方便修 ...

  6. PHP按最大宽高等比例缩放图片类 http://www.oschina.net/code/snippet_876708_21113

    PHP按最大宽高等比例缩放图片类 http://www.oschina.net/code/snippet_876708_21113 php 等比例缩小图片 http://www.111cn.net/p ...

  7. 【Thumbnailator】java 使用Thumbnailator实现等比例缩放图片,旋转图片等【转载】

    Thumbnailator概述:     Thumbnailator是与Java界面流畅的缩略图生成库.它简化了通过提供一个API允许精细的缩略图生成调整生产从现有的图像文件的缩略图和图像对象的过程, ...

  8. C#等比例缩放图片

    等比例缩放图片(C#) private Bitmap ZoomImage(Bitmap bitmap, int destHeight, int destWidth) { try { System.Dr ...

  9. DTCMS,添加文章时,内容中第一张图片作缩略图,并且等比例缩放图片

    DTCMS,添加文章时,内容中第一张图片作缩略图 admin/article/article_edit.aspx.cs 导入: using System.Drawing;using System.Dr ...

随机推荐

  1. 拾遗:Go 代码结构

    #define @ $ 概述 Go 编码通常将所有代码放置在同一个工作区 一个工作区包含多个版本仓库,使用 Git 等工具控制 每个仓库包含一个或多个包 每个包由同一目录中的一份或多份源代码组成 包的 ...

  2. Git 学习第三天(二)

    默认情况下, Git合并是采用"fast forward"模式,但这种模式下,如果删除分支,会丢掉分支信息 禁用 fast forward 模式: git merge --no-f ...

  3. python中函数的定义及调用

    python中函数的定义及使用方法 1.函数的概念:函数是将具有独立功能的代码块组织为一个整体,使其具有特殊功能的代码集; 2.函数的作用:使用函数可以加强代码的复用性,提高程序编写的效率; 3.函数 ...

  4. 豆瓣图书Top250

    从豆瓣图书Top250抓取数据,并通过词云图展示 导入库 from lxml import etree #解析库 import time #时间 import random #随机函数 import ...

  5. pycharm的第一次使用(其实并不是第一次)

    file --> settings --> editor -->general --> change font size file --> settings --> ...

  6. springMvc框架之Restful风格

    method: @Controller @RequestMapping("/test") public String MyController{ @RequestMapping(& ...

  7. 结对编程-Core 第12组 [pb15061359+pb15061351]

    一.项目要求 1.输入题目数量,生成操作数为3~5个的四则运算题目 2.输入上限值控制生成的操作数的最大值以及结果的最大值 3.输入支持的操作符类型:加.减.乘.除.乘方.括号 4.输入支持的操作数类 ...

  8. 安装Hama的基本过程

  9. userdel -删除使用者帐号及相关档案

    总览 SYNOPSIS userdel [-r] login 描述 userdel 命 令 修 改 系 统 帐 号 档 删 除 所 有 login 会 参 考 的 部 份 . 使 用 者 名 称 必 ...

  10. vue-cli 4058错误

    vue搭建项目 执行命令 npm install -g vue-cli   出现错误 4058 1.按照文章http://www.jb51.net/article/126221.htm操作没有效果 2 ...