js 获取自适应高度div的高度

您所在的位置:网站首页 js获取div高度 js 获取自适应高度div的高度

js 获取自适应高度div的高度

#js 获取自适应高度div的高度| 来源: 网络整理| 查看: 265

忙了将近一个月的论坛官网终于做好了,今天在调试bug,遇到了一个问题,设计稿(左)和实际(右):

      

好了大家发现问题了吧,就是最下方的版权块定位问题,方案是在屏幕中最新回复数量少或者无回复时,屏幕无滚动,版权块在屏幕最下方,如果评论过多,则版权块距离最后一条考评论的margin-top是固定的80px,然后要虑到要金融各种屏幕大小的手机,如果用fixed定位是绝对不行的,因为评论一旦过多,多到该出现滚动的时候,版权快的位置就应该在所有评论的下方80px处,所以这里只能动态获得上面几个div的高度以及屏幕总高度来判断版权块位置。

一般的获取div高度的方法就是$('元素').height()方法,百度上都是如下这种吊毛:

var h1 = document.getElementById("div1").offsetHeight; //js写法

var h = $("#div1").height(); //jquery写法

但是要知道我这当然不是一个静态页面,需要获取高度的div中的数据是php从数据库获取的,xpost方法传到前台,再循环append到评论板块的div中去。并不是css属性里设置一个height再在js获得它,这就属于一个自适应div块。

所以思路就是:等到数据全部填充到该div块中之后,再获取其高度:

$.xpost(window.location.pathname,'', function (code, message) { ...... $('reply').append(text[0]+text[1]+text[2]+text[3]+text[4]+text[5]+text[6]+text[7]+text[8]+text[9]+text[10]); setTimeout(function(){ var h = $('.div').eq(0).outerHeight(true); console.log("高度为:"+h); },0); } 即:在该自适应div元素加载完成之后,再用height的方法获取整个高度,这里添加了一个setTimeout(fun,time),这还是 有必要的,数据加载填充毕竟没有那么快,这里setTimeout()方法间隔时间是0,即将此过程加入执行队列中,在以上所有 程序执行完成再来执行该过程,即至少是等到以上动作全部完成才来执行的,所以获取的高度值才是准确的。 以下数据参考: alert($(window).height()); //浏览器当前窗口可视区域高度 alert($(document).height()); //浏览器当前窗口文档的高度 alert($(document.body).height());//浏览器当前窗口文档body的高度 alert($(document.body).outerHeight(true));//浏览器当前窗口文档body的总高度 包括border padding margin


【本文地址】


今日新闻


推荐新闻


CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3