jquery .scrollTop(） 屏幕高度

jquery .scrollTop() screen height

本文关键字：屏幕 高度 scrollTop jquery      更新时间：2023-09-26

我一直在编写一个小脚本，用于缩短在我的JSON提要上输出的文档。

我意识到，对于较长的消息，最小化它可能会跳过一些，您必须向后滚动才能找到您所在的位置，因此添加了一个滚动功能，将您带回缩小消息的顶部。事实证明，当它每次都触发时，这很烦人 - 所以我想，为什么不只在元素顶部在屏幕上方时才让它触发呢？

这就是我被困的地方 -> $(window).scrollTop();根本不想为我输出屏幕高度，这很令人愤怒。我尝试使用不同的浏览器，唯一正确的.scrollTop（）是Internet Explorer。

这是下面的功能：

function jexpand(id){
    var elm=$('#d'+jdesc[id].i); // element
    var ofs=elm.offset().top; // element height - works fine
    var top=$(window).scrollTop(); // Y U NO WORK?!!!
    if(jdesc[id].e==true){ // boolean to check whether to expand or contract
        jdesc[id].e=false; // change boolean flag
        if(ofs < top) $('html').animate({scrollTop:($('#'+jdesc[id].i).offset().top)-(20)+'px'},'slow'); // animate to top minus 20 pixels
        elm.html(jdesc[id].d.substring(0,347)+'...<br><div class="readmore"><span id="'+id+'">Show More</span></div>');
    }else{
        jdesc[id].e=true;
        elm.html(jdesc[id].d+'<br><div class="readmore"><span id="'+id+'">Show Less</span></div>');
    }
    $('.readmore span').click(function(){jexpand(this.id)}); // reset click trigger
    //alert(top+' <-> '+ofs);
}

当我在IE以外的浏览器中取消注释底部的alert（）时（我尝试了chrome，mozilla，chrome android，船浏览器android），我收到类似于以下内容的消息：

[object Window] <-> 1077.5625

[对象窗口]显然不是一个可以大于或小于元素高度的数字！那么这是什么意思，我需要问它另一个标志吗？起初我认为这可能是我引用的错误元素，所以尝试了top=$('body').scrollTop();、html等，我什至尝试使用div 包装器元素，但无济于事。

我正在使用jquery 1.11.0，而在1.9.1中我遇到了同样的问题。

我

是否试图以错误的方式返回屏幕顶部，或者我所有的浏览器都循环了？

编辑：

奇怪的是，我发现了一个可能可以解释一些问题的问题，当我在控制台中键入 $（document）.scrollTop（） 时，它给了我正确的屏幕高度，但是如果我在函数之外进行var top;，我会得到此错误'window.webkitStorageInfo' is deprecated. Please use 'navigator.webkitTemporaryStorage' or 'navigator.webkitPersistentStorage' instead.。

我正在使用从html5up借来的webkit，这在某种程度上干扰了代码。现在找出它是什么....

很抱歉造成混乱，没有这个脚本，一切都可以正常工作 grr...

试试这种方式

JS代码： 

 $(window).scrollTop(0);  // this will scroll to top of the page

现场演示：

http://jsfiddle.net/dreamweiver/fZrz7/6/

快乐编码:)

$(document).scrollTop()呢？它总是对我有用。

像这样尝试一下。

if($(window).scrollTop()>500){
     elm.html(jdesc[id].d.substring(0,347)+'...<br><div class="readmore"><span id="'+id+'">Show More</span></div>');}
else{
     elm.html(jdesc[id].d+'<br><div class="readmore"><span id="'+id+'">Show Less</span></div>');
}

如果工作，请尝试下一步

var ofs=elm.offset().top;

试试这个： 

$(document).height(); //returns window height
$(document).scrollTop(); //returns scroll position from top of document
$(selector)[0].scrollHeight;
$(document).prop('scrollHeight');
相关文章：