使用jquery获取元素的可见高度而不是其实际高度

此职位与this one有关。请考虑阅读它。 :-)使用jquery获取元素的可见高度而不是其实际高度

在我链接到的文章中，我想到了解决方案，我的问题是如果div的可见高度大于另一个div的大小，则更改链接的目标。在我的布局中，我所指的所有div都有1100px的高度。但那不是我想要的。我希望脚本能够获取当前对访问者可见的div的高度，而不是其真正的高度。有没有办法使用jQuery来做到这一点？

在此先感谢！

来源

2013-01-02 Tom S.

你试过了什么？检查函数'jQuery.offset（）'，以及视口信息和元素高度将帮助你弄清楚。只是加法和减法的问题。 – Pablo

你有没有想过这个？我正在尝试做同样的事情，而且我没有运气。 – JacobTheDev

用另一个DIV包装视口DIV的内容。定位DIV以读取所有内容的高度，如下所示：

JQuery：$（'div＃contents'）。height（）;

布局：

<div id="viewport"> 
    <div id="contents">...all your div contents...</div> 
</div>

希望这有助于。祝你好运。

来源

2013-01-02 17:15:07

-1

您是否必须使用固定的1100px高度？因为你也可以指定一个最大高度：1100px;和高度：100％; 根据您想要通过

$('.divclass').height();

来源

2013-01-02 17:18:49 gulty

把DIV中，你当然可以得到当前的高度有什么你可以做的是把元素位置到其父容器的顶部，然后减去其从父母集装箱高度。这会给你元素的可见高度。

$('#container').height() - $('#overflow').position().top

这是一个fiddle显示这一点。

来源

2013-01-02 17:24:15

我从来没有使用.offset之前，所以首先感谢你的答案，这教会了我一些东西。 :-)我试图用你的方法想出一些东西，但不幸的是它没有工作。假设我有3个高度均为1100px的div。因此，我的整个文件是3300px高。我想要做的是计算最后一个div的顶部和文档顶部之间的距离，然后根据结果更改链接的目标。所以：alert（3300 - $（'＃div3'）。offset（）。top） –

当我在文档的顶部时，它返回了1100，这正是我所期望的。但后来我滚动了一下，启动了脚本，但它仍然返回了1100.我认为这会给我一个高于1100的数字，但它不会。所以我猜.offset并不完全符合我的想法，它只是不适应当前的滚动位置。： -/ –

@TomS。添加'$（window）.scrollTop（）'到你的警报，它会给你你想要的。 [小提琴]（http://jsfiddle.net/bplumb/mbZby/4/） –

使用jquery获取元素的可见高度而不是其实际高度

回答

相关问题