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 相关文章推荐
IE DOM实现存在的部分问题及解决方法
Jul 25 Javascript
讨论html与javascript在浏览器中的加载顺序问题
Nov 27 Javascript
JS完整获取IE浏览器信息包括类型、版本、语言等等
May 22 Javascript
Javascript Objects详解
Sep 04 Javascript
jQuery中bind()方法用法实例
Jan 19 Javascript
JavaScript中的标签语句用法分析
Feb 10 Javascript
动态的9*9乘法表效果的实现代码
May 16 Javascript
TypeScript入门-接口
Mar 30 Javascript
jQuery EasyUI 组件加上“清除”功能实例详解
Apr 11 jQuery
Vue2.0设置全局样式(less/sass和css)
Nov 18 Javascript
React路由管理之React Router总结
May 10 Javascript
vue2的 router在使用过程中遇到的一些问题
Apr 13 Vue.js
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
超神学院:鹤熙已踏入神圣领域,实力不比凯莎弱
2020/03/02 国漫
隐性调用php程序的方法
2015/06/13 PHP
js文件中调用js的实现方法小结
2009/10/23 Javascript
JavaScript中判断对象类型的几种方法总结
2013/11/11 Javascript
JavaScript定义变量和变量优先级问题探讨
2014/10/11 Javascript
js判断浏览器版本以及浏览器内核的方法
2015/01/20 Javascript
js超时调用setTimeout和间歇调用setInterval实例分析
2015/01/28 Javascript
jfreechart插件将数据展示成饼状图、柱状图和折线图
2015/04/13 Javascript
Bootstrap实现水平排列的表单
2016/07/04 Javascript
JavaScript暂停和继续定时器的实现方法
2016/07/18 Javascript
VUE axios上传图片到七牛的实例代码
2017/07/28 Javascript
JavaScript requestAnimationFrame动画详解
2017/09/14 Javascript
将jquery.qqFace.js表情转换成微信的字符码
2017/12/01 jQuery
vue中锚点的三种方法
2018/07/06 Javascript
vue动画—通过钩子函数实现半场动画操作
2020/08/09 Javascript
python 合并文件的具体实例
2013/08/08 Python
老生常谈python之鸭子类和多态
2017/06/13 Python
Python+OpenCV实现图像融合的原理及代码
2018/12/03 Python
10招!看骨灰级Pythoner玩转Python的方法
2019/04/15 Python
详解PyCharm+QTDesigner+PyUIC使用教程
2019/06/13 Python
Python re 模块findall() 函数返回值展现方式解析
2019/08/09 Python
tensorflow 固定部分参数训练,只训练部分参数的实例
2020/01/20 Python
django中的数据库迁移的实现
2020/03/16 Python
美国卡车、吉普车和SUV零件网站:4 Wheel Parts
2016/11/24 全球购物
英国手机零售商:Carphone Warehouse
2018/06/06 全球购物
学院书画协会部门职责
2013/11/28 职场文书
生产部岗位职责范文
2014/02/07 职场文书
酒店秘书求职信范文
2014/02/17 职场文书
写给老婆的检讨书
2014/02/21 职场文书
2015年教师新年寄语
2014/12/08 职场文书
2014年政府采购工作总结
2014/12/09 职场文书
水电工程师岗位职责
2015/02/13 职场文书
2015年学校心理健康教育工作总结
2015/05/11 职场文书
起诉书范文
2015/05/20 职场文书
JavaScript 防篡改对象的用法示例
2021/04/24 Javascript
浅谈如何提高PHP代码的质量
2021/05/28 PHP