मैं दो तत्वों के बीच चौड़ाई की गणना कैसे करूं?

Question

मुझे दो तत्वों के बीच की चौड़ाई की गणना करने की आवश्यकता है, लेकिन मुझे यकीन नहीं है कि मैं इसके बारे में कैसे जाऊंगा। मैं निम्नलिखित है कहते हैं:

<ul id="foo"> 
    <li style="width:10px;"><a href="#">1</a></li> 
    <li style="width:20px;"><a href="#">2</a></li> 
    <li style="width:30px;"><a href="#">3</a></li> 
</ul> 

मैं 1 और 3 के बीच की दूरी (उत्तर 20px जा रहा है) की गणना कैसे होगा? चौड़ाई परिवर्तनीय हो सकती है जैसे सूची आइटम की संख्या? (मैं प्रोटोटाइप ढांचे का उपयोग कर रहा)

धन्यवाद

Answer 1

आप दो तत्वों के बीच क्षैतिज दूरी मतलब हैं, तो आप बाईं तत्व के ऊपरी दाएँ coord और सही तत्व के शीर्ष छोड़ दिया coord के बीच अंतर की जरूरत है। पेकका के जवाब में दिए गए अनुसार, तत्व का शीर्ष दायां समन्वय शीर्ष बाएं कोऑन और इसकी चौड़ाई है।

शीर्ष बाएं स्थिति को एक तत्व प्राप्त करने के लिए, आप जावास्क्रिप्ट विधि ऑफ़सेट लेफ्ट() का उपयोग कर सकते हैं। यह एक तत्व और उसके माता-पिता के बीच एक्स आयाम में ऑफ़सेट देता है। जब तक आप दस्तावेज़ रूट तक नहीं पहुंच जाते, तब तक आप लगातार ऑफसेट लेफ्ट को जोड़कर डीओएम पेड़ को फिर से सक्रिय करते हैं। परिणामस्वरूप योग आपकी एक्स स्थिति है। उत्कृष्ट Quirksmode आपको दिखाता है कि यह कैसे करें।

संपादित करें: पूर्णता के लिए, मैं उदाहरण जावास्क्रिप्ट एक तत्व की स्थिति को खोजने के लिए शामिल हैं:

function getNodePosition(node) {  
    var top = left = 0; 
    while (node) {  
     if (node.tagName) { 
      top = top + node.offsetTop; 
      left = left + node.offsetLeft;  
      node = node.offsetParent; 
     } else { 
      node = node.parentNode; 
     } 
    } 
    return [top, left]; 
} 

Answer 2

आप क्षैतिज दूरी मतलब है, मैं इसे पसंद कुछ कहेंगे:

X position of element 2 
minus 
x position of element 1 plus width of element 1 

चौड़ाई प्राप्त करने के लिए, का उपयोग getWidth()

स्थिति पाने के लिए, positionedOffset() सही बात हो सकती है, मैं 100% निश्चित नहीं हूं और यह आपके तत्वों की स्थिति पर निर्भर करता है।

और एक सामान्य चेतावनी, यदि आपके तत्वों में padding है, तो यह ब्राउज़र (आईई/एफएफ) पर निर्भर करेगा कि पैडिंग की गणना चौड़ाई में है या नहीं। यह सीमा पर भी लागू हो सकता है। आपको चारों ओर खेलना होगा और देखना होगा।