jquery实现在页面加载完毕后获取图片高度或宽度
更新时间：2014年06月16日 16:46:52 投稿：whsnow
应项目要求，需要在页面加载完毕之后获取图片的高度，本例使用jquery来完成这个功能，需要的朋友可以参考下
日前，本技术屌丝又遇到了一个很有意思的问题，应项目要求，需要在页面加载完毕之后获取图片的高度，以此来调整图片上面的覆盖层相对于图片顶端的位置。
但在jquery(function(){ /*XXXXXX*/});里面写了之后发现不是很理想，因为当jquery准备就绪的时候，此时图片绝大部分情况下都没加载完毕，这可急坏了本屌丝~~~T~T
本屌丝就想啊，要是jquery有个跟js的onload()的方法多好啊，擦~真是天上掉下个大狗屎，恰巧砸到本屌丝~~在网上搜了下，还真有这么个方法，写法如下：
$(window).load(function() {
alert("你猜图片加载完毕了吗？");
});
本屌丝见到这个方法，如同在贫民窟里看到一坨金光闪闪的狗屎~~遂赶紧试了下，哇~~~哇~~~哇哦~~~真爽！还真解决了！
不得不佩服jquery的强大！为了保险期间，进行了深层的进化，代码如下：
jQuery(function(){
jQuery(window).load(function(){
/*对图片的操作，可获取img高度，宽度，进行一些列操作等！*/
});
});
但在jquery(function(){ /*XXXXXX*/});里面写了之后发现不是很理想，因为当jquery准备就绪的时候，此时图片绝大部分情况下都没加载完毕，这可急坏了本屌丝~~~T~T
本屌丝就想啊，要是jquery有个跟js的onload()的方法多好啊，擦~真是天上掉下个大狗屎，恰巧砸到本屌丝~~在网上搜了下，还真有这么个方法，写法如下：
复制代码 代码如下:
$(window).load(function() {
alert("你猜图片加载完毕了吗？");
});
本屌丝见到这个方法，如同在贫民窟里看到一坨金光闪闪的狗屎~~遂赶紧试了下，哇~~~哇~~~哇哦~~~真爽！还真解决了！
不得不佩服jquery的强大！为了保险期间，进行了深层的进化，代码如下：
复制代码 代码如下:
jQuery(function(){
jQuery(window).load(function(){
/*对图片的操作，可获取img高度，宽度，进行一些列操作等！*/
});
});
您可能感兴趣的文章:
- jquery实现动态改变div宽度和高度
- jquery动态改变div宽度和高度
- 基于jQuery实现左右div自适应高度完全相同的代码
- js/jquery获取浏览器窗口可视区域高度和宽度以及滚动条高度实现代码
- js和jquery如何获取图片真实的宽度和高度
- JQuery获取当前屏幕的高度宽度的实现代码
- JS和jquery获取各种屏幕的宽度和高度的代码
- 使用jquery获取网页中图片高度的两种方法
- JQuery获取各种宽度、高度(format函数)实例
- JQuery获取浏览器窗口内容部分高度的代码
- jQuery获取页面及个元素高度、宽度的总结——超实用
- jquery获取文档高度和窗口高度汇总
- jQuery实现获取隐藏div高度的方法示例
相关文章
这篇文章主要为大家详细介绍了jquery插件实现扫雷游戏第二篇，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2021-04-04
jquery-1.2.6得到焦点与失去焦点的实现方法。点击“运行”后，请刷新一次。2009-05-05
基于jquery实现的上传图片及图片大小验证、图片预览效果代码
基于jquery实现的上传图片及图片大小验证、图片预览效果代码，需要的朋友可以参考下。2011-04-04
这篇文章主要介绍了jQueryUI Datepicker组件设置日期高亮的相关方法，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2016-10-10
JQuery选择器之六 测试代码如下2009-07-07
本文给大家分享jQuey将序列化对象在前台显示地的几种方式，非常不错，具有参考借鉴价值，需要的朋友一起看看吧2016-12-12
jQuery 是一个快速、简单的JavaScript library， 它简化了HTML 文件的traversing，事件处理、动画、Ajax 互动，从而方便了网页制作的快速发展。 jQuery 是为改变你编写JavaScript 的方式而设计的，本文给大家分享jquery validate初步体验(一)，感兴趣的朋友一起学习吧2015-12-12
使用jQuery的live()方法绑定事件，有时会出现重复绑定的情况，如，当点击一个按钮时，此按钮所绑定的事件会并执行n遍2011-10-10
jquery插件jquery.nicescroll实现图片无滚动条左右拖拽的方法
这篇文章主要介绍了jquery插件jquery.nicescroll实现图片无滚动条左右拖拽的方法,实例分析了jquery.nicescroll插件实现图片拖拽效果的方法,需要的朋友可以参考下2015-08-08
animate动画示例(泪奔的小孩)及stop和delay的使用
实现原理：停止动画，当一个元素有一个动画队列时，停止的是当前动画，紧接着执行下一个动画，具体代码如下，感兴趣的朋友可以参考下哈，希望对你学习jquery动画有所帮助2013-05-05
最新评论