एलिमेंट ऑफ़सेटटॉप प्रॉपर्टी
तत्व वस्तुउदाहरण
एक <div> तत्व की ऑफसेट टॉप स्थिति प्राप्त करें:
var testDiv = document.getElementById("test");
document.getElementById("demo").innerHTML = testDiv.offsetTop;
परिभाषा और उपयोग
ऑफ़सेटटॉप प्रॉपर्टी ऑफ़सेटपैरेंट तत्व के शीर्ष के सापेक्ष शीर्ष स्थान (पिक्सेल में) लौटाती है।
लौटाए गए मूल्य में शामिल हैं:
- शीर्ष स्थान, और तत्व का मार्जिन
- ऑफसेटपैरेंट तत्व की शीर्ष पैडिंग, स्क्रॉलबार और सीमा
नोट: ऑफ़सेटपैरेंट तत्व निकटतम पूर्वज है जिसकी स्थिति स्थिर के अलावा अन्य है।
युक्ति: किसी तत्व की बाईं स्थिति वापस करने के लिए, ऑफ़सेट लेफ्ट गुण का उपयोग करें।
ब्राउज़र समर्थन
Property | |||||
---|---|---|---|---|---|
offsetTop | Yes | 8.0 | Yes | Yes | Yes |
वाक्य - विन्यास
शीर्ष ऑफ़सेट स्थिति लौटाएँ:
object.offsetTop
टेक्निकल डिटेल
डिफ़ॉल्ट मान: | कोई डिफ़ॉल्ट मान नहीं |
---|---|
प्रतिलाभ की मात्रा: | एक संख्या, पिक्सेल में तत्व की शीर्ष स्थिति का प्रतिनिधित्व करती है |
डोम संस्करण: | सीएसएसओएम |
और ज्यादा उदाहरण
उदाहरण
आ <div> तत्व की स्थिति प्राप्त करें:
var testDiv = document.getElementById("test");
var demoDiv = document.getElementById("demo");
demoDiv.innerHTML = "offsetLeft: " + testDiv.offsetLeft + "<br>offsetTop: " + testDiv.offsetTop;
उदाहरण
एक चिपचिपा नेविगेशन बार बनाएं:
// Get the navbar
var navbar = document.getElementById("navbar");
//
Get the offset position of the navbar
var sticky = navbar.offsetTop;
// Add the sticky class to the navbar when you reach its scroll position.
Remove the sticky class when you leave the scroll position.
function myFunction() {
if (window.pageYOffset
>= sticky) {
navbar.classList.add("sticky")
}
else {
navbar.classList.remove("sticky");
}
}
तत्व वस्तु