HTML DOM ऑफ़सेटहाइट प्रॉपर्टी
उदाहरण
पैडिंग और बॉर्डर सहित <div> तत्व की ऊंचाई और चौड़ाई प्राप्त करें:
var elmnt = document.getElementById("myDIV");
var txt = "Height with padding and border: " + elmnt.offsetHeight + "px<br>";
txt += "Width with padding and border: " + elmnt.offsetWidth + "px";
नीचे और अधिक "इसे स्वयं आज़माएं" उदाहरण।
परिभाषा और उपयोग
ऑफसेटहाइट प्रॉपर्टी पिक्सेल में किसी तत्व की देखने योग्य ऊंचाई लौटाती है, जिसमें पैडिंग, बॉर्डर और स्क्रॉलबार शामिल हैं, लेकिन मार्जिन नहीं।
"देखने योग्य" शब्द निर्दिष्ट करने का कारण यह है कि यदि तत्व की सामग्री तत्व की वास्तविक ऊंचाई से लंबी है, तो यह गुण केवल दृश्यमान ऊंचाई लौटाएगा (देखें "अधिक उदाहरण")।
नोट: इस संपत्ति को समझने के लिए, आपको सीएसएस बॉक्स मॉडल को समझना होगा ।
युक्ति: इस संपत्ति का उपयोग अक्सर ऑफसेटविड्थ संपत्ति के साथ किया जाता है।
युक्ति: केवल पैडिंग सहित, किसी तत्व की देखने योग्य ऊंचाई और चौड़ाई वापस करने के लिए क्लाइंटहाइट और क्लाइंटविड्थ गुणों का उपयोग करें ।
युक्ति: किसी तत्व में स्क्रॉलबार जोड़ने के लिए, CSS अतिप्रवाह गुण का उपयोग करें।
यह संपत्ति केवल पढ़ने के लिए है।
ब्राउज़र समर्थन
Property | |||||
---|---|---|---|---|---|
offsetHeight | Yes | Yes | Yes | Yes | Yes |
वाक्य - विन्यास
element.offsetHeight
टेक्निकल डिटेल
प्रतिलाभ की मात्रा: | पैडिंग, बॉर्डर और स्क्रॉलबार सहित पिक्सेल में किसी तत्व की देखने योग्य ऊंचाई का प्रतिनिधित्व करने वाली संख्या |
---|
और ज्यादा उदाहरण
उदाहरण
यह उदाहरण क्लाइंटहाइट/क्लाइंटविड्थ और ऑफ़सेटहाइट/ऑफ़सेटविड्थ के बीच के अंतर को दर्शाता है:
var elmnt = document.getElementById("myDIV");
var txt = "";
txt += "Height with padding: " + elmnt.clientHeight + "px<br>";
txt += "Height with padding and border: " + elmnt.offsetHeight + "px<br>";
txt += "Width with padding: " + elmnt.clientWidth + "px<br>";
txt += "Width with padding and border: " + elmnt.offsetWidth + "px";
उदाहरण
जब हम तत्व में स्क्रॉलबार जोड़ते हैं, तो यह उदाहरण क्लाइंटहाइट/क्लाइंटविड्थ और ऑफ़सेटहाइट/ऑफ़सेटविड्थ के बीच अंतर को प्रदर्शित करता है:
var elmnt = document.getElementById("myDIV");
var txt = "";
txt += "Height with padding: " + elmnt.clientHeight + "px<br>";
txt += "Height with padding, border and scrollbar: " + elmnt.offsetHeight + "px<br>";
txt += "Width with padding: " + elmnt.clientWidth + "px<br>";
txt += "Width with padding, border and scrollbar: " + elmnt.offsetWidth + "px";