jquery实现在页面加载完毕后获取图片高度或宽度

日前，本技术屌丝又遇到了一个很有意思的问题，应项目要求，需要在页面加载完毕之后获取图片的高度，以此来调整图片上面的覆盖层相对于图片顶端的位置。

但在jquery(function(){ /*XXXXXX*/});里面写了之后发现不是很理想，因为当jquery准备就绪的时候，此时图片绝大部分情况下都没加载完毕，这可急坏了本屌丝~~~T~T

本屌丝就想啊，要是jquery有个跟js的onload()的方法多好啊，擦~真是天上掉下个大狗屎，恰巧砸到本屌丝~~在网上搜了下，还真有这么个方法，写法如下：


代码如下:

$(window).load(function() {
alert("你猜图片加载完毕了吗？");
});

本屌丝见到这个方法，如同在贫民窟里看到一坨金光闪闪的狗屎~~遂赶紧试了下，哇~~~哇~~~哇哦~~~真爽！还真解决了！

不得不佩服jquery的强大！为了保险期间，进行了深层的进化，代码如下：


代码如下:

jQuery(function(){
jQuery(window).load(function(){
/*对图片的操作，可获取img高度，宽度，进行一些列操作等！*/
});
});

赞 (0)

相关推荐

  • 基于jQuery实现左右div自适应高度完全相同的代码

    在线演示:http://demo.jb51.net/js/2012/jquery_demo/jquery_div_autoheihet.htm完整代码: 复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns=&quo

  • js和jquery如何获取图片真实的宽度和高度

    1.什么时候需要获取图片真实的宽度和高度 在做pc网页的时候,有时候会考虑按照插入的图片的尺寸来判断图片是横图还是竖图.然后判断过后给予不同的展示方式! 另外一种就是在手机页面上,在新闻页插入的图片往往都是按照图片的原尺寸来展示,如果手机屏幕太小,太大的图就会超出去!这时候有两种解决办法 1)给所有的图片加上这样的样式 1 复制代码 代码如下: .news img{margin:5px auto; display:block;width:100%; height:auto;} 但是这种方式有另外

  • JQuery获取当前屏幕的高度宽度的实现代码

    复制代码 代码如下: <script type="text/javascript"> $(document).ready(function() { alert($(window).height()); //浏览器当前窗口可视区域高度 alert($(document).height()); //浏览器当前窗口文档的高度 alert($(document.body).height());//浏览器当前窗口文档body的高度 alert($(document.body).out

  • jQuery获取页面及个元素高度、宽度的总结——超实用

    下面把jQuery获取页面及个元素高度.宽度的方法汇总,分享给大家. 获取浏览器显示区域(可视区域)的高度 : 复制代码 代码如下: $(window).height(); 获取浏览器显示区域(可视区域)的宽度 : 复制代码 代码如下: $(window).width(); 获取页面的文档高度 复制代码 代码如下: $(document).height(); 获取页面的文档宽度 : 复制代码 代码如下: $(document).width(); 浏览器当前窗口文档body的高度: 复制代码 代码

  • 使用jquery获取网页中图片高度的两种方法

    使用jquery获取网页中图片的高度其实很简单,有两种常用的方法都可以打到我们的目的 复制代码 代码如下: $("img").whith();(返回纯数字) $("img").css("width");(返回字符串:数字+"px") 但是有时候会遇到返回0的情况,上面方法返回值竟然是0或者0px,很让人诧异 方法一 在很早之前,我使用的解决方法,这也是我的师傅告诉我的解决方法:在你需要获取到的图片的<img>标签上

  • js/jquery获取浏览器窗口可视区域高度和宽度以及滚动条高度实现代码

    获取浏览器窗口的可视区域高度和宽度,滚动条高度有需要的朋友可参考一下.IE中,浏览器显示窗口大小只能以下获取: 代码如下复制代码 复制代码 代码如下: document.body.offsetWidth document.body.offsetHeight 在声明了DOCTYPE的浏览器中,可以用以下来获取浏览器显示窗口大小: 代码如下复制代码 复制代码 代码如下: document.documentElement.clientWidth document.documentElement.cli

  • jquery实现动态改变div宽度和高度

    完整代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>jquery动态改变div宽度

  • jquery获取文档高度和窗口高度汇总

    jquery获取窗口高度和窗口高度,$(document).height().$(window).height() $(document).height():整个网页的文档高度 $(window).height():浏览器可视窗口的高度 $(window).scrollTop():浏览器可视窗口顶端距离网页顶端的高度(垂直偏移) $(document.body).height();//浏览器当前窗口文档body的高度 $(document.body).outerHeight(true);//浏览

  • JQuery获取浏览器窗口内容部分高度的代码

    JQuery获取浏览器窗口内容部分高度的代码

    下面是测试代码,记得先引用JQuery库 复制代码 代码如下: <script type="text/javascript"> $(document).ready( function() { var h = $(window).height(); alert(h); } ) </script> Firefox下: IE下: 可以发现它获取的却是是窗口的内容部分高度,而不是浏览器窗口的高度.Oh Yeah!

  • jquery动态改变div宽度和高度

    完整代码: 复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>jque

  • JQuery获取各种宽度、高度(format函数)实例

    复制代码 代码如下: <html xmlns="http://www.w3.org/1999/xhtml"><head>    <title>获取页面宽度</title>    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js" type="text/javascript"></

  • jQuery实现获取隐藏div高度的方法示例

    jQuery实现获取隐藏div高度的方法示例

    本文实例讲述了jQuery实现获取隐藏div高度的方法.分享给大家供大家参考,具体如下: <!DOCTYPE HTML> <html lang="en-US"> <head> <meta charset="UTF-8"> <title>测试获取隐藏div高度</title> <meta name="description" content="jquery获取隐

  • JS和jquery获取各种屏幕的宽度和高度的代码

    Javascript: 网页可见区域宽: document.body.clientWidth 网页可见区域高: document.body.clientHeight 网页可见区域宽: document.body.offsetWidth (包括边线的宽) 网页可见区域高: document.body.offsetHeight (包括边线的高) 网页正文全文宽: document.body.scrollWidth 网页正文全文高: document.body.scrollHeight 网页被卷去的高

随机推荐