继续浏览精彩内容
慕课网APP
程序员的梦工厂
打开
继续
感谢您的支持,我会继续努力的
赞赏金额会直接到老师账户
将二维码发送给自己后长按识别
微信支付
支付宝支付

width()和height()方法chrome下的兼容性

安卓入门学习视频
关注TA
已关注
手记 267
粉丝 68
获赞 387

今天在用jquery的width()和height()方法获取img元素的宽和高时,在火狐浏览器下能够获取到值,在谷歌浏览器下获取到的值却为0,我想了半天,搞不懂这两个常用的方法怎么还会不兼容谷歌呢。纳闷之下,我就想是不是因为img元素是内联元素的原因。


于是我给img元素转化为了内联块元素,并给了宽和高的值,于是在谷歌浏览器下管用了。


所以总结:jquery的height(),width()方法要是用在内联元素上,且内联元素没有设定为内联块或者块元素,同时没有设置高和宽的值得话,在谷歌浏览器下可能不起效果。


例如:

//滑过brand图片出现放大镜的效果    $(".jnBrandList ul li").each(function(index){        var $img = $(this).find("img");        var img_w = $img.width();        var img_h = $img.height();        var spanHtml = '<span  class="imageMask"></span>';        $(spanHtml).appendTo(this);    })    /*$(".jnBrandList").delegate(".imageMask", "hover", function(){        $(this).toggleClass("imageOver");    });*/    $(".jnBrandList").find(".imageMask").live("hover", function(){        $(this).toggleClass("imageOver");    });


打开App,阅读手记
0人推荐
发表评论
随时随地看视频慕课网APP