前端集合 - 关注前端技术和互联网免费资源

关注前端技术和互联网免费资源

分类儿

页面儿

搜索儿

前端集合 RSS订阅
Home » 经验记录,前端集合 » 判断2个div块Height高低并赋值

判断2个div块Height高低并赋值

发布者:前端集合 // 发布时间:2011-03-13 21:17:42 // 分类:经验记录,前端集合 // 访问: 3,787 次 // 热度:

接着上一篇文章继续折腾:

上一篇文章的留言中有朋友提醒我:“如果右块高度比左块低,会不会导致左块的内容被溢出不显示之类的问题。应该是取左右2者的最高值吧来对齐吧”。

的确,文章中的代码只能将右div块的高度赋值给左div块。因为当时工作中碰到的情况是右div不可能比左div低,所以没有考虑左div比右div高的情况。

今晚没事,就折腾改进了一下代码,改进以后代码会对左右div块的高度进行比较。哪个div Height值大,就将其值赋给Height值小的div,从而使2个div高度始终保持一致。看代码:


经测试,该代码有效。

效果请看Demo

另外,在实际运用,可能还会存在由于左div或右div存在padding属性而导致上述取值变多或变少的问题。比如,最终赋值时发现left比right还高10px,那么也可以通过修改上述代码解决:

$("left").style.height=$("right").offsetHeight-10 + "px";	

同时,我已经将这种方法运用于本博客中。因为我的博客刚好是左右2侧高度不一致。运用这个方法很好的解决了这个问题,整个主题看起来更协调更美观啦。

Tags: div, 自动获取div高度, 赋值, 判断div高度

【微博之博】Alexa排名进入前十万>>  << 如何让2个并列的div根据内容自动保持同等高度
Top