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等比例缩放图片,限定最大宽度和最大高度的更多相关文章

  1. JS按比例缩放图片

    1.JS代码 <script type="text/javascript" language="javascript"> var flag = fa ...

  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. js 中导出excel 较长数字串会变成科学计数法(转载)

    在做项目中,碰到如题的问题.比如要将居民的信息导出到excel中,居民的身份证号码因为长度过长(大于10位),excel会自动的将过长的数字串转换成 科学计数法.现在网上找到解决方案之一: (在数字串 ...

  2. Yii框架2.0的视图和widgets表单的使用

    2.0的控制器的创建和action方法的添加和1.0的基本是一样的.但我发现他的widgets 的ActiveForm和1.1版本有些不一样的地方. 对于视图基本也是一样的,有render 和 ren ...

  3. 前端开发 - HTML - 总结

    html head标签 title 显示网站的标题 meta 提供有关页面的原信息 link 链接css资源文件.网站图标 style 定义内部样式表 script 链接脚本js文件 body标签 块 ...

  4. Guess Your Way Out! II---cf 558D (区间覆盖,c++STL map 的使用)

    题目链接:http://codeforces.com/contest/558/problem/D 题意就是有一个二叉树高度为 h ,人站在根节点上,现在要走出去,出口在叶子节点上,有 q 条信息,每条 ...

  5. Python 类型和对象(转)

    译文:http://wiki.woodpecker.org.cn/moin/PyTypesAndObjects 原文:http://www.cafepy.com/article/python_attr ...

  6. git在使用中出现 refusing to merge unrelated histories如何解决?

    一.GIT的使用 # 设置用户名 git config --global user.name "zhaijihai" # 设置用户邮箱 git config --global us ...

  7. maven 整合 ssm 异常分析

    异常一:使用tomcat 7 启动没问题访问(JSP)页面就报错:org.apache.jasper.JasperException: Unable to compile class for JSP ...

  8. django模型:字段和选项

    https://blog.csdn.net/iloveyin/article/details/44852645一.常用字段1.字段类型使用时需要引入django.db.models包,字段类型如下Au ...

  9. python web框架 django 工程 创建 目录介绍

    # 创建Django工程django-admin startproject [工程名称] 默认创建django 项目都会自带这些东西 django setting 配置文件 django可以配置缓存 ...

  10. Swift 语言附注 类型

    本页包括内容: 类型注解(Type Annotation) 类型标识符(Type Identifier) 元组类型(Tuple Type) 函数类型(Function Type) 数组类型(Array ...