关于获取图片在网页加载后的高度

最近在做一个带有轮播的项目，轮播思想是根据获取图片宽度高度再赋值给轮播的div。看代码

$(function(){
var slidesImgWidth=$('.slides_img').width();var slidesImgHeight=$('.slides_img').height();$('#slider1_container ,#slides_items').width(slidesImgWidth);$('#slider1_container ,#slides_items').height(slidesImgHeight);
})

本地测试是ok的，但是放到服务器后浏览发现第一次打开页面全是空白，刷新后恢复正常，打印后才发现原来是一开始图片未加载获取不到高度。针对此问题百度出一大堆的看法，
下面是本人整理出的两种快捷偏方，请各位笑纳。
1.window.onload=function(){}或者$(window).load(function(){})
window.onload=function(){  var slidesImgWidth=$('.slides_img').width();  var slidesImgHeight=$('.slides_img').height();  $('#slider1_container ,#slides_items').width(slidesImgWidth);   $('#slider1_container ,#slides_items').height(slidesImgHeight);} 
window.onload的原理是等页面数据加载完再处理。也就是说图片加载完后再处理。
2.
$(function(){// var winWidth = parseInt($(window).width());$('.slides_img').each(function(index){var $this = $(this);var src = $this.attr('src');var img = new Image()img.onload = function(){console.log(this.src, this.width,this.height);//打印出图片真是高度var slidesImgWidth2=this.width;if(slidesImgWidth2>winWidth){$($this).css("width","100%").css("height","auto");}else{
$($this).css("width",realWidth+'px').css("height",realHeight+'px');//插入真实高度
}var slidesImgWidth1=$('.slides_img').width();//获取页面里的图片宽度var slidesImgHeight1=$('.slides_img').height();获取页面里的图片高度$('#slider1_container ,#slides_items').width(slidesImgWidth1);$('#slider1_container ,#slides_items').height(slidesImgHeight1);}img.src = src;});// })
此方法可以获取到图片的真实高度，不过比较繁琐。
这两种办法都有一点点小问题，页面加载的一瞬间轮播高度会变，不过不影响我们达到目的
------------------------------------------------------------------------------------------------------------------分割线-----------------------------------------------------------------------------------------------------------
推荐一篇好文http://www.cnblogs.com/haoyijing/p/5818236.html 
里面有讲到先使用懒加载再获取高度等多种办法，懒加载对我来说是比较鸡肋了，怎么看都会影响加载速度，还不如简单点~~~
 
 
  
  
阅读全文
                                             
        0        0           
	
				
	
					   
关于获取图片在网页加载后的高度
	  	   
关于在页面加载完后使用js修改图片高度进行手机屏幕适配的问题
	  	   
如何在页面加载完毕后获取图片高度或宽度问题
	  	   
jquery获取不到图片的高度  需要在window.onload=function后才能获取到
	  	   
iOS webView 加载HTML5获取加载后的高度
	  	   
获取WebView加载网页后的cookies
	  	   
当网页高度计算不准确时,尝试在网页加载完后多次调用
	  	   
iOS    获取 webView 加载完成后的高度
	  	   
javascript获取动态加载图片的宽度和高度？
	  	   
获取div在浏览器以下的网页高度
	  	   
关于异步加载获取网络图片的
	  	   
js获取网页的高度
	  	   
学习htmlunit获取动态网页加载后的代码
	  	   
获取webView中网页的高度，并拦截图片修改图片的尺寸
	  	   
关于PopupWindow wrap_content 后获取高度宽度
	  	   
WKWebview 获取网页高度，图片点击查看，网页链接点击
	  	   
IOS Swift TableViewCell 加载网络图片后图片高度
	  	   
计算UIWebView加载网页的内容高度
	     		  
	  	   
ajax访问jeesite session超时时返回 json
	  	   
再谈java乱码：GBK和UTF-8互转尾部乱码问题分析
	  	   
mysql视图的作用（详细）
	  	   
【Java】String经MD5加密后的32位输出
	  	   
Integer类型与int的==比较
	  	   
关于获取图片在网页加载后的高度
	  	   
javascript – 为什么null是一个对象,null和undefined之间有什么区别？（最通俗的解释，推荐）
	  	   
java mail发送邮件
	  	   
架构师的能力模型
	  	   
Python 安装
	  	   
Vue-cli创建vue项目以及配置文件梳理
	  	   
[LeetCode 415] Add Strings(Python)
	  	   
独立看门狗
	  	   
IntelliJ Idea 常用快捷键列表