jQuery在页面加载时动态修改图片尺寸的方法
更新时间：2015年03月20日 10:55:27 作者：令狐不聪
这篇文章主要介绍了jQuery在页面加载时动态修改图片尺寸的方法,实例分析了jQuery操作图片的技巧,非常具有实用价值,需要的朋友可以参考下
本文实例讲述了jQuery在页面加载时动态修改图片尺寸的方法。分享给大家供大家参考。具体如下：
$(window).bind("load", function() {
// IMAGE RESIZE
$('#product_cat_list img').each(function() {
var maxWidth = 120;
var maxHeight = 120;
var ratio = 0;
var width = $(this).width();
var height = $(this).height();
if(width > maxWidth){
ratio = maxWidth / width;
$(this).css("width", maxWidth);
$(this).css("height", height * ratio);
height = height * ratio;
}
var width = $(this).width();
var height = $(this).height();
if(height > maxHeight){
ratio = maxHeight / height;
$(this).css("height", maxHeight);
$(this).css("width", width * ratio);
width = width * ratio;
}
});
//$("#contentpage img").show();
// IMAGE RESIZE
});
希望本文所述对大家的jQuery程序设计有所帮助。
相关文章
jQuery 位置函数offset,innerWidth,innerHeight,outerWidth,outerHei
jQuery的位置函数(offset(),innerWidth(),innerHeight(),outerWidth(),outerHeight(),scrollTop(),scrollLeft())小应用2010-03-03
这篇文章主要为大家详细介绍了JQuery AJAX MD5实现用户注册即时验证功能,具有一定的参考价值，感兴趣的小伙伴们可以参考一下2016-10-10
在Web开发中,表单提交是一个常见的操作,通过表单提交用户可以向服务器发送数据,jQuery是一个流行的JavaScript库,可以简化处理JavaScript的操作,包括表单提交,在本篇博客中,我们将介绍如何使用jQuery来实现表单提交操作,需要的朋友可以参考下2024-09-09
jQuery .tmpl(), .template()学习资料小结
昨晚无意中发现一个有趣的jQuery插件.tmpl()，其文档在这里。2011-07-07
uploadify 3.0 详细使用说明,需要的朋友可以参考下2012-06-06
这篇文章主要介绍了jQuery实现智能判断固定导航条或侧边栏的方法,涉及jQuery针对页面元素属性的判断与动态操作相关技巧,需要的朋友可以参考下2016-09-09
jQuery EasyUI 中文API Layout(Tabs)
发布jQuery EasyUI 中文API—Layout(Tabs)总结，需要的朋友可以参考下。2010-04-04
这篇文章主要介绍了jQuery深拷贝Json对象的简单实现方法,以简单示例形式分析了jQuery深拷贝的操作技巧,需要的朋友可以参考下2016-07-07
jquery EasyUI的formatter格式化函数代码
以下实例格式化数据表格中的一列。如果金额小于20时使用自定义的格式器将文本变成红色。2011-01-01
Json是一种轻量级的数据交换格式，本节为大家介绍的是Jquery解析Json格式数据的过程，很详细，看看就知道了2014-10-10
最新评论