zoukankan
html css js c++ java
JavaScript,等比例缩放图片的函数,很好用。
在Web上显示图片,通常都会有图片显示比例问题,如果不给<img />限制width和height,那么如果图片大了就会将整个页面挤乱,图片小了又会使图片失真。
我的需求如下:
1、预先定义好图片显示的标准宽度和高度。
2、如果图片的大小超过了标准定义,那么等比例压缩图片。
3、如果图片的大小等于标准定义,那么按照标准宽度和高度显示图片。
4、如果图片的大小小于标准定义,那么不对图片进行任何压缩处理。
可能是我搜索的关键字不对吧,在网上找了很长时间,才找到,感觉很好使。代码如下
<
script language
=
"
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;
}
}
}
//
-->
</
script
>
调用:
<
img src
=
"
images/toplogo.gif
"
onload
=
"
javascript:DrawImage(this,100,100)
"
>
查看全文
相关阅读:
@PostConstruct和 @PreDestroy注解
【JQuery】,ajax请求中,url出现[Object Object]
筛法求素数
母牛的故事
将一个数拆分
计算两个日期差
用二分查找——查找比目标元素略大的索引
反向输出字符串
bootstrap table合并单元格(该版本是简单的应用)
获取访问者IP
原文地址:https://www.cnblogs.com/kingeric/p/609476.html
最新文章
关于Flutter 利用 sharedPreferences 存取 Map
解决sdkmanager 没有 --licenses 和 --version。 update只显示 done
关于mac下 php 图片验证码报错无法加载,缺少freetype问题,以及php版本切换!一条龙解决
记录mac 给当前用户添加权限,sudo再也不需要输入密码了
记录mac下 sudp 启动 php-fpm 跳转到 /install/index.php 找不到文件的问题
关于div无法撑起父级div以及ul无法撑起外层div
排序算法和数据结构基础内容--思维导图总结
记mac下配置php+nginx环境(头都大了)
linux中mysql的二进制安装
SQL语句实践--DDL&&DCL语句之管理用户
热门文章
SQL语句实践--DDL(数据定义语言)语句管理数据库
MYSQL修改密码及找回密码
centos7:mysql-5.7.30安装(二进制安装)
linux磁盘分区工具parted硬盘分区
linux磁盘分区工具fdisk硬盘分区
linux磁盘阵列raid 5的搭建教程
linux中的备份神器rsync实现远程同步
抓包工具 tcpdump 用法说明
任务分配算法
树莓派4B搭建centos7 Linux服务器
Copyright © 2011-2022 走看看