<script  language="javascript">
//显示缩略图
function DrawImage(ImgD,width_s,height_s){
/*var width_s=139;
var height_s=104;
*/
var image=new Image();
image.src=ImgD.src;
if(image.width> && image.height>){
flag=true;
if(image.width/image.height>=width_s/height_s){
if(image.width>width_s){
ImgD.width=width_s;
ImgD.height=(image.height*width_s)/image.width;
}else{
ImgD.width=image.width;
ImgD.height=image.height;
}
}
else{
if(image.height>height_s){
ImgD.height=height_s;
ImgD.width=(image.width*height_s)/image.height;
}else{
ImgD.width=image.width;
ImgD.height=image.height;
}
}
}
/*else{
ImgD.src="";
ImgD.alt=""
}*/
}
</script> 调用
<div><img src="图片" align="center" onload="DrawImage(this,200,200)"></div>

JS创建缩略图的更多相关文章

  1. JavaScript with Image:创建缩略图

    当图片很大,直接把图片从Server下载到浏览器上看是一种很不明智的做法,浪费了服务器的资源,网络带宽和客户端的资源.所以,通常Server和Client之间会传输缩略图,只有当Client请求某张图 ...

  2. 使用 Amazon S3 触发器创建缩略图

    使用 Amazon S3 触发器创建缩略图 环境 centos (注意,必须是Linux环境) node12.x 安装教程 curl -sL https://rpm.nodesource.com/se ...

  3. PHP 创建缩略图

    一.成比例缩小图像 <?php /* 创建缩略图 */ $file = __DIR__.'/button.png'; $scale = 0.5; // 比例 $image = ImageCrea ...

  4. 用Backbone.js创建一个联系人管理系统(五)

    原文: Build a Contacts Manager Using Backbone.js: Part 5 这是这系列教程最后一部分了. 之前所有的增删改都在前端完成. 这部分我们要把Contact ...

  5. 使用 iosOverlay.js 创建 iOS 风格的提示和通知

    iosOverlay.js 用于在 Web 项目中实现 iOS 风格的通知和提示效果.为了防止图标加载的时候闪烁,你需要预加载的图像资源.不兼容 CSS 动画的浏览器需要 jQuery 支持.浏览器兼 ...

  6. Dynamics.js - 创建逼真的物理动画的 JS 库

    Dynamics.js 是一个用来创建物理动画 JavaScript 库.你只需要把dynamics.js引入你的页面,然后就可以激活任何 DOM 元素的 CSS 属性动画,也可以用户 SVG 属性. ...

  7. 使用three.js创建3D机房模型-分享一

    序:前段时间公司一次研讨会上,一市场部同事展现了同行业其他公司的3D机房,我司领导觉得这个可以研究研究,为了节约成本,我们在网上大量检索,最后找到一位前辈的博文[TWaver的技术博客],在那篇博文的 ...

  8. Node.js 创建HTTP服务器

    Node.js 创建HTTP服务器 如果我们使用PHP来编写后端的代码时,需要Apache 或者 Nginx 的HTTP 服务器,并配上 mod_php5 模块和php-cgi. 从这个角度看,整个& ...

  9. 用Backbone.js创建一个联系人管理系统(一)

    原文 Build a Contacts Manager Using Backbone.js: Part 1 在这个教程里我们将会使用Backbone.js,Underscore.js,JQuery创建 ...

随机推荐

  1. [Centos] Centos 7笔记

    命令行与图形界面 在X-Window图形操作界面中按“Alt+Ctrl+功能键Fnn=1~6”就可以进入Console字符操作界面.这就意味着你可以同时拥有X-Window加上6个Console字 ...

  2. ASP.NET 系统对象 Request(一)

    Request对象 用来获取客户端在请求一个页面或传送一个Form是提供的所有信息.它包括用户的HTTP变量.能够识别的浏览器.存储客户端的Cookie信息和请求地址等. Request对象是Syst ...

  3. Android实现页面跳转及传递参数的方法

    简单的示例 实现的效果是这样的: 第一个页面有一个按钮,一个文本框,点击按钮,将文本框的内容传递到第二个页面,并显示在第二个页面中. 首先是在给按钮添加点击事件 setOnClickListener( ...

  4. Android滑动菜单特效实现,仿人人客户端侧滑效果,史上最简单的侧滑实现

    http://blog.csdn.net/guolin_blog/article/details/8714621 http://blog.csdn.net/lmj623565791/article/d ...

  5. 进阶系列五【绝对干货】----Git教程

    一.介绍 1.1Git是什么? Git是目前世界上最先进的分布式版本控制系统.什么是版本控制系统?请自行百度. 1.2Git与SVN对比有什么特点? SVN是集中式版本控制系统.版本库是集中放在中央服 ...

  6. C#高级编程笔记 Delegate 的粗浅理解 2016年9月 13日

    Delegate [重中之重] 委托 定义一:(参考)http://www.cnblogs.com/zhangchenliang/archive/2012/09/19/2694430.html 完全可 ...

  7. 【Python基础学习三】数字(Number)

    Python Number 数据类型用于存储数值. 数据类型是不允许改变的,这就意味着如果改变 Number 数据类型的值,将重新分配内存空间. Python 四种数值类型: 整型(Int) - 通常 ...

  8. oracle查询某一个字段的数量总和

    select count(*) from (select count(*) from 表名称 group by 多种数据量 ) 表名; 举个栗子: 比如说我有一个数据类型的字段, 里面有很多种的数据类 ...

  9. 4. UIButton的使用

    1. UIButton的初认识 来自:http://www.cnblogs.com/mcj-coding/p/5103891.html QQ:853740091 1.1 UIButton 是iOS 开 ...

  10. iOS开发UI篇—核心动画(UIView封装动画)

    iOS开发UI篇—核心动画(UIView封装动画) 一.UIView动画(首尾) 1.简单说明 UIKit直接将动画集成到UIView类中,当内部的一些属性发生改变时,UIView将为这些改变提供动画 ...