वर्तमान स्क्रॉल स्थिति प्राप्त करें और इसे एक लिंक के साथ एक चर के रूप में पास करें?

Question

मैं ईमानदार रहूंगा, मैं यहां अपनी गहराई से बाहर हूं। मैंने एक पेजिनेशन सिस्टम बनाया है जहां आप पेज पर फिर से लोड किए गए लिंक पर क्लिक करते हैं और एक निश्चित संख्या में सूची आइटम एक अनियंत्रित सूची में दिखाए जाते हैं। जब आप इसे फिर से क्लिक करेंगे तो यह पृष्ठ और अधिक आइटम दिखाएगा। सोचें कि ट्विटर आपकी फ़ीड में ट्वीट कैसे दिखाता है।

समस्या तब होती है जब यह पृष्ठ को फिर से लोड करता है जो यह शीर्ष पर रहता है। मैं जो चाहता हूं वह उस पृष्ठ पर उसी स्थिति पर कूदने के लिए है जो पहले था।

मेरे पास पहले से ही लिंक सेट अप के लिए एक चयनकर्ता है, मुझे नहीं पता कि वर्तमान स्क्रॉल स्थिति कैसे प्राप्त करें और फिर इसे कूदने के लिए नए पेज पर पास करें।

यहाँ मेरी कोड अब तक बताया गया है:

jQuery(document).ready(function(){ 
    $("a[rel=more]").live("click", function(){ 
     //script... 
    }); 
}); 

मैं यहाँ से कहाँ जाते हैं?

Answer 1

1. पूरे पृष्ठ को पुनः लोड करने के बजाय AJAX का उपयोग करके आइटम को दोबारा लोड करें।

2. window.pageYOffset और window.scrollTo(0, y) का उपयोग कर स्क्रॉल स्थिति प्राप्त करें और सेट करें।

   मैं यूआरएल के हैश में स्थिति की दुकान चाहते हैं:

   // after loading the document, scroll to the right position 
   // maybe location.hash has to be converted to a number first 
   $(document).ready(function() { 
       window.scrollTo(0, location.hash); 
   }); 
   
   // I'm not quite sure if reload() does preserve the hash tag. 
   location.hash = window.pageYOffset; 
   location.reload(); 
   

Answer 2

के रूप में जी एस ने कहा कि एक ajax कॉल के माध्यम से करने के बजाय पृष्ठ पुनः लोड करने के तत्वों को जोड़ने।

यदि आप jQuery.ScrollTo प्लगइन का उपयोग नहीं करना चाहते हैं। जो स्क्रॉलिंग से संबंधित सबकुछ का समर्थन करता है, आप कभी भी

Answer 3

@Shawn Grigson के लिंक के अनुसार सपने देख सकते हैं, पेजYOffset सभी ब्राउज़रों में समान नहीं है।

एक jQuery समाधान (उम्मीद है कि वास्तव में क्रॉस-ब्राउज़र संगत है, हालांकि मैंने अभी तक इसका परीक्षण नहीं किया है) तत्व के लंबवत स्क्रॉल को प्राप्त करने और सेट करने के लिए scrollTop() है।

Answer 4

मुझे लगता है कि आपको जो चाहिए वह सिर्फ आपके लिंक के अंत में एक HTML एंकर को पास करने के लिए है। ब्राउज़र स्वचालित रूप से मिलान किए गए एंकर के बगल में तत्व पर स्क्रॉल करेगा। उदाहरण:

<a href="page2.html#myanchor">Next page</a> 

पृष्ठ 2 के बीच में कुछ बिंदु पर:

<a name="myanchor">My item N</a>