मैं दस्तावेज़ की स्क्रॉल स्थिति कैसे प्राप्त करूं?


82

दस्तावेज़ की स्क्रॉल स्थिति मान कैसे प्राप्त करें?

जवाबों:


46
$(document).height() //returns window height

$(document).scrollTop() //returns scroll position from top of document

मैं भी ऐसा ही सोच रहा था, लेकिन कंसोल.लॉग ($ (यह) .scrollTop ()) = 1187 कंसोल.लॉग ($ (यह) .height) () = 1762 क्यों इतना अलग है? 575px के लिए अगर मैंने पेज के नीचे स्क्रॉल किया है। कहां गए वो 575px? स्क्रॉल बार 576px नहीं हो सकता है :)
कोई व्यक्ति

3
बाहा फिर से मेरी गलती है। मैं खुली हुई फ़ायरबग विंडो के साथ स्क्रॉलबार देख रहा था। Ofc यह अब 576px हो सकता है। :) धन्यवाद मुझे लगता है कि विषय बंद है।
कोई

101
-1 - यह बहुत अच्छा है, लेकिन इस सवाल का जवाब नहीं है, जो के बारे में था scrollHeight
वेन

8
सही है, यह एक सवाल है। लेकिन न तो $ (दस्तावेज़) .height () या $ (दस्तावेज़) .scrollTop () वांछित जानकारी देता है। स्क्रॉलहाइट के लिए अनुरोध किया गया था। स्क्रॉलहाइट मान किसी तत्व के लिए उपलब्ध कुल ऊंचाई है (यदि यह स्क्रॉल करने योग्य है, तो यह मान ऊंचाई से बड़ा हो सकता है)। स्क्रॉलटॉप शीर्ष तत्व से कितनी दूरी पर है। न तो उत्तर दें कि कुल उपलब्ध ऊंचाई क्या है। स्क्रॉलहाइट की समझ के लिए help.dottoro.com/ljbixkkn.php देखें
Teynon

4
इसे उत्तर के रूप में चिह्नित किया गया है क्योंकि यह पूछने वाले के इच्छित प्रश्न का उत्तर देता है , जो उस ऊंचाई के बारे में था जिस पर वर्तमान में दस्तावेज़ स्क्रॉल किया गया है ... "स्क्रॉलहाइट।" यह एक संयोग है कि यह नाम एक अलग संदर्भ में उपयोग किया जाता है।
चेस संडमन

177

यहां बताया गया है कि scrollHeightjQuery चयनकर्ता का उपयोग करके प्राप्त किया गया तत्व कैसे प्राप्त करें:

$(selector)[0].scrollHeight

यदि selectorतत्व की आईडी है (उदाहरण के लिए elemId), यह गारंटी है कि सरणी का 0-अनुक्रमित आइटम वह तत्व होगा जिसे आप चुनना चाहते हैं, और scrollHeightसही होगा।


12
ध्यान रखें, मोज़िला नॉलेज बेस के अनुसार, यह IE डेवलपर
mozilla.org/en/DOM/element.scrollHeight

2
@ टॉमास से सहमत, क्रॉस ब्राउजर क्वर्क्स की बेहतर हैंडलिंग के लिए jQuery के एब्स्ट्रैक्शन का उपयोग करें। उदाहरण के लिए उपरोक्त $ (चयनकर्ता) .offset () में संशोधन किया जा सकता है। शीर्ष
बॉब ग्रेगोर

3
उम, नो $ (डॉक्यूमेंट) .offset () रिटर्न null, और .offset () का ब्राउजर के स्क्रॉल बार (.offset () डॉक्युमेंट्स के सापेक्ष आइटम्स के कोर्डिनेट्स) की स्थिति से कोई लेना-देना नहीं है। मैं सहमत हूं कि हमें जब संभव हो तो jQuery का उपयोग करना चाहिए, लेकिन जाहिर है, क्योंकि इसके लिए कोई क्रॉस ब्राउज़र समर्थन नहीं है, jQuery इसके लिए एक अमूर्तता प्रदान नहीं करता है।
BrainSlugs83

2
आप $ (चयनकर्ता) .get (0) .scrollHeight भी कर सकते हैं
सहयोगी

1
@Dmitri Zaitsev .scrollHeight एक डोम नोड प्रॉपर्टी है, न कि एक jQuery प्रॉपर्टी।
ज़मल्जोरादनिक

45

यदि आप Jquery 1.6 या इसके बाद के संस्करण का उपयोग कर रहे हैं, तो मूल्य तक पहुंचने के लिए प्रोप का उपयोग करें।

$(document).prop('scrollHeight')

पिछले संस्करणों में attr से मूल्य प्राप्त किया जाता था, लेकिन 1.6 पोस्ट नहीं किया गया।


12
यह jQuery 1.7.1 के साथ मेरे लिए "अपरिभाषित" देता है, जैसा कि $ (दस्तावेज़) .attr ("स्क्रॉलहाइट") करता है।
माइकल

5
ऐसा इसलिए है क्योंकि यह शरीर के तत्व को याद कर रहा है। इसे $ (document.body) .prop ('स्क्रॉलहाइट') होना आवश्यक है - जिस बिंदु पर आप केवल दस्तावेज़ का उपयोग कर सकते हैं।
Goddogsrunning

6
document.getElementById("elementID").scrollHeight

$("elementID").scrollHeight

तो आपके दस्तावेज़ ऑब्जेक्ट का तत्व आईडी क्या है? ... शायद आपका मतलब था "document.body.scrollHeight"?
BrainSlugs83

2
$ ('# गैलरी')। स्क्रॉलहाइट मुझे अपरिभाषित देता है // # गैलरी मेरे अतिप्रवाह की आईडी है: ऑटो तत्व, काम नहीं करता
अनमोल सराफ

6

यह HTML डोम एलिमेंट्स का उपयोग करता है, लेकिन jQuery चयनकर्ता का नहीं। इसका उपयोग इस तरह किया जा सकता है:

var height = document.body.scrollHeight;

3

कुछ इस तरह आपकी समस्या का समाधान होना चाहिए:

$.getDocHeight = function(){
     var D = document;
     return Math.max(Math.max(D.body.scrollHeight,    D.documentElement.scrollHeight), Math.max(D.body.offsetHeight, D.documentElement.offsetHeight), Math.max(D.body.clientHeight, D.documentElement.clientHeight));
};

alert( $.getDocHeight() );

Ps: हर बार जब आपको इसकी आवश्यकता होती है, तब कॉल करें, चेतावनी परीक्षण उद्देश्यों के लिए है ..


किसी कारण से यह फ़ंक्शन मेरे लिए सही ढंग से काम नहीं करता है; एक iframe के अंदर इसका उपयोग करना। <Html> की वास्तविक ऊंचाई 256px है, यह फ़ंक्शन मुझे 337px देता है और मुझे नहीं पता कि यह कहां से आ रहा है। PS मैं Chrome 18 का उपयोग कर रहा हूं।
jurchiks

@jurchiks: क्या आपके पास एक लिंक है जहां वह आइफ्रेम है, मेरे लिए एक नज़र रखना?
ज़ुल्ल

blade.dateks.lv/salidzinat?ids=58664,43586 । किसी भी प्रश्न चिह्न पर क्लिक करें। मैं इसमें से अधिकांश को ठीक करने में कामयाब रहा हूं, लेकिन उनमें से दो (और तुलना की जा रही वस्तुओं के आधार पर अधिक हैं) अभी भी नीचे कुछ अजीब, रहस्यमय ~ 20px मार्जिन है। यह तब गायब हो जाता है जब मैं विंडो का आकार बदल देता हूं, क्योंकि मैंने इसे विंडो आकार के पॉपअप आयामों में बदल दिया है।
jurchiks

3

विंडो स्क्रॉलबार द्वारा स्क्रॉल किए गए क्षेत्रों की वास्तविक स्क्रॉल करने योग्य ऊंचाई प्राप्त करने के लिए, मैंने उपयोग किया $('body').prop('scrollHeight')। यह सबसे सरल कार्य समाधान प्रतीत होता है, लेकिन मैंने संगतता के लिए बड़े पैमाने पर जाँच नहीं की है। इमानुएल डेल ग्रांडे ने एक और समाधान पर ध्यान दिया कि यह शायद 8 से नीचे IE के लिए काम नहीं करेगा।

अधिकतर अन्य समाधान स्क्रॉल करने योग्य तत्वों के लिए ठीक काम करते हैं, लेकिन यह पूरी विंडो के लिए काम करता है। विशेष रूप से, मेरे पास अंकित के समाधान के लिए माइकल के रूप में एक ही मुद्दा था, अर्थात्, वह $(document).prop('scrollHeight')वापस आ रहा है undefined



0

आप उदाहरण के लिए यह कोशिश कर सकते हैं, इस कोड ने सभी DIV टैग के लिए नीचे स्क्रॉलबार रखा है

याद रखें: jQuery मान के बजाय फ़ंक्शन को स्वीकार कर सकता है। "यह" jQuery द्वारा व्यवहार की गई वस्तु है, फ़ंक्शन वर्तमान DIV की स्क्रॉलहाइट प्रॉपर्टी "यह" लौटाता है और इसे दस्तावेज़ में सभी DIV के लिए करता है।

$("div").scrollTop(function(){return this.scrollHeight})
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.