手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >jQuery限制图片大小的方法
jQuery限制图片大小的方法
摘要:本文实例讲述了jQuery限制图片大小的方法。分享给大家供大家参考,具体如下:最近在搞一个信息网站,文章内容中可以显示图片,所以就需要限制用...

本文实例讲述了jQuery限制图片大小的方法。分享给大家供大家参考,具体如下:

最近在搞一个信息网站,文章内容中可以显示图片,所以就需要限制用户贴进去的图片的显示大小了。

在网上找到一段代码:

$(document).ready(function(){ $("#viewnews_body img").each(function(){ var width = 620; var height = 600; var image = $(this); if (image.width() > image.height()){ if(image.width()>width){ image.width(width); image.height(width/image.width()*image.height()); } }else{ if(image.height()>height){ image.height(height); image.width(height/image.height()*image.width()); } } }); });

用这个方法了实现运行效果不稳定,有时间图片还没有加载完毕就会先执行了。

所以改用给所有需要限制大小的图片绑定load事件的方法来实现,这样保证了在每个图片加载完后再分别执行限制大小的代码。代码如下:

$(document).ready(function(){ $("#viewnews_body img").bind("load",function(){ var width = 620; var height = 600; var image = $(this); if (image.width() > image.height()){ if(image.width()>width){ image.width(width); image.height(width/image.width()*image.height()); } }else{ if(image.height()>height){ image.height(height); image.width(height/image.height()*image.width()); } } }); });

希望本文所述对大家jQuery程序设计有所帮助。

【jQuery限制图片大小的方法】相关文章:

jQuery实现首页图片淡入淡出效果的方法

jQuery获取字符串中出现最多的数

网页里控制图片大小的相关代码

js控制div弹出层实现方法

Javascript实现每日自动换一张图片的方法

jQuery实现不断闪烁文字的方法

JS或jQuery获取ASP.NET服务器控件ID的方法

jQuery实现返回顶部效果的方法

javascript常用的方法分享

JQuery中DOM实现事件移除的方法

精品推荐
分类导航