JS创建缩略图
<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创建缩略图的更多相关文章
- JavaScript with Image:创建缩略图
当图片很大,直接把图片从Server下载到浏览器上看是一种很不明智的做法,浪费了服务器的资源,网络带宽和客户端的资源.所以,通常Server和Client之间会传输缩略图,只有当Client请求某张图 ...
- 使用 Amazon S3 触发器创建缩略图
使用 Amazon S3 触发器创建缩略图 环境 centos (注意,必须是Linux环境) node12.x 安装教程 curl -sL https://rpm.nodesource.com/se ...
- PHP 创建缩略图
一.成比例缩小图像 <?php /* 创建缩略图 */ $file = __DIR__.'/button.png'; $scale = 0.5; // 比例 $image = ImageCrea ...
- 用Backbone.js创建一个联系人管理系统(五)
原文: Build a Contacts Manager Using Backbone.js: Part 5 这是这系列教程最后一部分了. 之前所有的增删改都在前端完成. 这部分我们要把Contact ...
- 使用 iosOverlay.js 创建 iOS 风格的提示和通知
iosOverlay.js 用于在 Web 项目中实现 iOS 风格的通知和提示效果.为了防止图标加载的时候闪烁,你需要预加载的图像资源.不兼容 CSS 动画的浏览器需要 jQuery 支持.浏览器兼 ...
- Dynamics.js - 创建逼真的物理动画的 JS 库
Dynamics.js 是一个用来创建物理动画 JavaScript 库.你只需要把dynamics.js引入你的页面,然后就可以激活任何 DOM 元素的 CSS 属性动画,也可以用户 SVG 属性. ...
- 使用three.js创建3D机房模型-分享一
序:前段时间公司一次研讨会上,一市场部同事展现了同行业其他公司的3D机房,我司领导觉得这个可以研究研究,为了节约成本,我们在网上大量检索,最后找到一位前辈的博文[TWaver的技术博客],在那篇博文的 ...
- Node.js 创建HTTP服务器
Node.js 创建HTTP服务器 如果我们使用PHP来编写后端的代码时,需要Apache 或者 Nginx 的HTTP 服务器,并配上 mod_php5 模块和php-cgi. 从这个角度看,整个& ...
- 用Backbone.js创建一个联系人管理系统(一)
原文 Build a Contacts Manager Using Backbone.js: Part 1 在这个教程里我们将会使用Backbone.js,Underscore.js,JQuery创建 ...
随机推荐
- NOSDK--项目历程
nosdk是一个基于cocos2d-x的sdk自动打包及统一接入框架,项目地址:https://github.com/nottvlike/nosdk.git. --更新(2015.07.15) 添加u ...
- C/C++学习链接
C/C++堆和栈的区别:http://blog.csdn.net/hairetz/article/details/4141043
- Servlet接口五种方法介绍
Servlet接口定义了5种方法: init() service() destroy() getServletConfig() getServletInfo() init() 在Servlet实例化后 ...
- Ruby常用比较操作符
操作符 含义 == 测试值是否相等 ==== 用来比较case语句的目标和每个when从句的项 <=> 通用比较操作符. 根据接受者小于, 等于, 大于其参数, 返回-1, 0. 1 & ...
- 【Android学习】《Android开发视频教程》第二季笔记(未完待续)
视频地址: http://study.163.com/course/courseMain.htm?courseId=207001 课时22 Activity生命周期(一) 1.如何在一个应用中添加新 ...
- MySQL分库分表总结
单库单表 单库单表是最常见的数据库设计,例如,有一张用户(user)表放在数据库db中,所有的用户都可以在db库中的user表中查到. 单库多表 随着用户数量的增加,user表的数据量会越来越大,当数 ...
- Java批量文件打包下载
经常遇到选择多个文件进行批量下载的情况,可以先将选择的所有的文件生成一个zip文件,然后再下载,该zip文件,即可实现批量下载,但是在打包过程中,常常也会出现下载过来的zip文件中里面有乱码的文件名, ...
- stl vector erase
C++ Code 12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849 ...
- Bootstrap3 CSS样式基本用法总结
按钮 a,input,button都可以设置为按钮 a标签按钮 button标签按钮 <a class="btn btn-default" href="#&qu ...
- ABAP BAPI 销售订单生产交货单函数
TYPES: BEGIN OF ty_so, vbeln LIKE vbap-vbeln, posnr LIKE vbap-posnr, END ...