jquery图片不完全按比例自动缩小的简单代码


Posted in Javascript onJuly 29, 2013
jQuery(document).ready(function()
{ 
/* 图片不完全按比例自动缩小*/ 
$(window).load(function(){$('#content div.thumbnail img').each(function(){ var x = 200; 
//填入目标图片宽度
 var y = 140; 
//填入目标图片高度
 var w=$(this).width(), h=$(this).height();
//获取图片宽度、高度 
if (w > x) { 
//图片宽度大于目标宽度时 
var w_original=w, h_original=h; h = h * (x / w);
 //根据目标宽度按比例算出高度 w =x;
 //宽度等于预定宽度 if (h < y) { 
//如果按比例缩小后的高度小于预定高度时
 w = w_original * (y /h_original); 
//按目标高度重新计算宽度 h = y;
 //高度等于预定高度 
} 
}
$(this).attr({width:w,height:h}); }); }); });
Javascript 相关文章推荐
在jQuery 1.5中使用deferred对象的代码(翻译)
Mar 10 Javascript
提交表单时执行func方法实现代码
Mar 17 Javascript
IE 下Enter提交表单存在重复提交问题的解决方法
May 04 Javascript
javascript实现简单加载随机色方块
Dec 25 Javascript
使用JS实现图片展示瀑布流效果(简单实例)
Sep 06 Javascript
原生JS获取元素集合的子元素宽度实例
Dec 14 Javascript
百度地图JavascriptApi Marker平滑移动及车头指向行径方向
Mar 13 Javascript
关于 angularJS的一些用法
Nov 29 Javascript
vue 组件的封装之基于axios的ajax请求方法
Aug 11 Javascript
vue+vue-router转场动画的实例代码
Sep 01 Javascript
微信小程序module.exports模块化操作实例浅析
Dec 20 Javascript
原生JS实现拖拽效果
Dec 04 Javascript
jquery验证手机号码、邮箱格式是否正确示例代码
Jul 28 #Javascript
jquery 定位input元素的几种方法小结
Jul 28 #Javascript
jquery 获取表单元素里面的值示例代码
Jul 28 #Javascript
a标签的href和onclick 的事件的区别介绍
Jul 26 #Javascript
alert中断settimeout计时功能
Jul 26 #Javascript
JS清除IE浏览器缓存的方法
Jul 26 #Javascript
jquery简单的拖动效果实现原理及示例
Jul 26 #Javascript
You might like
Zend studio for eclipse中使php可以调用mysql相关函数的设置方法
2008/10/13 PHP
php修改上传图片尺寸的方法
2015/04/14 PHP
PHP通过加锁实现并发情况下抢码功能
2016/08/10 PHP
PHP 中TP5 Request 请求对象的实例详解
2017/07/31 PHP
javascript字典探测用户名工具
2006/10/05 Javascript
javascript 可以拖动的DIV(二)
2009/06/26 Javascript
基于jQuery的日期选择控件
2009/10/27 Javascript
juqery 学习之三 选择器 子元素与表单
2010/11/25 Javascript
contains和compareDocumentPosition 方法来确定是否HTML节点间的关系
2011/09/13 Javascript
jquery操作cookie插件分享
2014/01/14 Javascript
iframe父页面获取子页面参数的方法
2014/02/21 Javascript
JQuery EasyUI 数字格式化处理示例
2014/05/05 Javascript
JavaScript 中有关数组对象的方法(详解)
2016/08/15 Javascript
详解XMLHttpRequest(二)响应属性、二进制数据、监测上传下载进度
2016/09/14 Javascript
关于Angularjs中自定义指令一些有价值的细节和技巧小结
2018/04/22 Javascript
JavaScript 中的12种循环遍历方法【总结】
2018/05/31 Javascript
AngularJS 监听变量变化的实现方法
2018/10/09 Javascript
IE9 elementUI文件上传的问题解决
2018/10/17 Javascript
微信打开网址添加在浏览器中打开提示的办法
2019/05/20 Javascript
原生JS实现音乐播放器的示例代码
2021/02/25 Javascript
[01:10]DOTA2次级职业联赛 - Fly战队宣传片
2014/12/01 DOTA
python贪吃蛇游戏代码
2020/04/18 Python
Python 多线程C段扫描、检测 Ping扫描脚本的实现
2020/09/03 Python
用Python自动清理系统垃圾的实现
2021/01/18 Python
基于Modernizr 让网站进行优雅降级的分析
2013/04/21 HTML / CSS
德国玩具商店:Planet Happy DE
2021/01/16 全球购物
物流专业大学生求职信范文
2013/10/28 职场文书
违反校纪校规检讨书
2014/02/15 职场文书
技校毕业生个人学习的自我评价
2014/02/21 职场文书
委托书如何写
2014/08/30 职场文书
忠诚教育心得体会
2014/09/03 职场文书
2014年九一八事变演讲稿
2014/09/14 职场文书
学生未请假就回家检讨书
2014/09/22 职场文书
运动会400米加油稿(8篇)
2014/09/22 职场文书
2015年小学生新年寄语
2014/12/08 职场文书
SqlServer数据库远程连接案例教程
2021/07/15 SQL Server