కోర్సు సిఫార్సులు:
- ముందు పేజీ scrollX
- తరువాత పేజీ sessionStorage
- పైకి తిరిగి విండో ఆబ్జెక్ట్
విండో స్క్రాల్యు అనువర్తనం
scrollY
అనువర్తనం వివరణము మరియు ఉపయోగం
scrollY
అనువర్తనం పరిమితం కాగలదు.
అనుసందానం
scrollY
అనువర్తనం సమానం కాగలదు: pageYOffset
అనువర్తనం.
క్రాస్-బ్రాండ్ కంపాటిబిలిటీ కొరకు ఉపయోగించండి: window.pageYOffset
కాని: window.scrollY
.
మరియు చూడండి:
ఉదాహరణ
ఉదాహరణ 1
కంటెంట్ ను 100 పిక్సెల్స్ స్క్రాల్ చేసి, scrollX మరియు scrollY ను అనుసందానం చేయండి:
window.scrollBy(100, 100); alert(window.scrollX + window.scrollY);
ఉదాహరణ 2
స్టికీ నేవిగేషన్ బార్ సృష్టించండి:
// నేవిగేషన్ బార్ ను పొందండి const navbar = document.getElementById("navbar"); // నేవిగేషన్ బార్ యొక్క ఆఫ్సెట్ పొందండి const sticky = navbar.offsetTop; // మీరు అది స్క్రాల్ పోసిషన్ చేరినప్పుడు స్టికీ క్లాస్ ను నేవిగేషన్ బార్ కు జోడించండి. స్క్రాల్ పోసిషన్ బయటకు వెళ్ళినప్పుడు స్టికీ క్లాస్ ను తొలగించండి. function myFunction() { if (window.scrollY >= sticky) { navbar.classList.add("sticky") } navbar.classList.remove("sticky"); } }
సంకేతం
window.scrollY
లేదా:
scrollY
పునఃతిరిగి వచ్చే విలువ
రకం | వివరణ |
---|---|
సంఖ్య | డాక్యుమెంట్ కింది తెర యింటర్వాల్ పిక్సెల్స్ ను రోల్ చేస్తుంది. |
బ్రౌజర్ మద్దతు
అన్ని బ్రౌజర్లు మద్దతు ఇస్తాయి window.scrollY
కాలం
చ్రోమ్ | ఐఈ | ఎడ్జ్ | ఫైర్ఫాక్స్ | సఫారీ | ఓపెరా |
---|---|---|---|---|---|
చ్రోమ్ | ఐఈ | ఎడ్జ్ | ఫైర్ఫాక్స్ | సఫారీ | ఓపెరా |
మద్దతు | 9-11 | మద్దతు | మద్దతు | మద్దతు | మద్దతు |
- ముందు పేజీ scrollX
- తరువాత పేజీ sessionStorage
- పైకి తిరిగి విండో ఆబ్జెక్ట్