किसी तत्व का सही ऑफ़सेट कैसे प्राप्त करें? - jQuery

Question

यह शायद एक बहुत आसान सवाल है, लेकिन मैं jQuery में एक तत्व के सही ऑफसेट के बारे में कैसे जाना है ?

मैं कर सकता हूँ:

$("#whatever").offset().left;

और यह मान्य है।

लेकिन ऐसा लगता है कि:

$("#whatever").offset().right 

अपरिभाषित है।

तो कोई इसे jQuery में कैसे पूरा करता है?

धन्यवाद!!

Answer 1

एलेक्स, गैरी:

अनुरोध के रूप में, यहाँ मेरी टिप्पणी एक उत्तर के रूप में पोस्ट की गई है:

var rt = ($(window).width() - ($whatever.offset().left + $whatever.outerWidth()));

मुझे बताने के लिए धन्यवाद।

छद्म कोड में जिसे निम्न के रूप में व्यक्त किया जा सकता है:

सही ऑफसेट है:

खिड़की की चौड़ाई MINUS
(तत्व का बायां ऑफसेट तत्व के बाहरी चौड़ाई से अधिक है )

Comments

यह CSS ट्रांसफ़ॉर्म के साथ काम नहीं करता है, ऑफ़सेट ट्रांसफ़ॉर्म से प्रभावित होगा लेकिन आउटरविद (और चौड़ाई) नहीं होगा।

— जोनाथन।

यह विंडो के दाईं ओर से ऑफसेट है। विंडो के बाईं ओर से ऑफसेट के लिए, cdZ का उत्तर देखें ।

— कोडबेलिंग

किसी तत्व का सबसे ऊपरी छोर अधिक "मूल" पाया जा सकता है $whatever[0].getBoundingClientRect().right। यह खिड़की के बाएं किनारे के सापेक्ष है।

— पस्टनटॉन

धन्यवाद ब्रेंडन। मददगार जवाब।

Answer 2

var $whatever        = $('#whatever');
var ending_right     = ($(window).width() - ($whatever.offset().left + $whatever.outerWidth()));

संदर्भ:। रूटर ()

Comments

मुझे लगता है कि उन्हें जोड़ने की जरूरत है और फिर माइनस 1. यदि चौड़ाई 2 है, तो बाएं 10 पर है, और दाएं 12 पर नहीं है, लेकिन 11.

— 7 पर एकाधिकार

यह गलत उत्तर है। CSS में, "बाएं" का तात्पर्य खिड़की / माता-पिता के बाएं से तत्व के सबसे बाएं बिंदु की ऑफसेट ", और" दाएं "का अर्थ है खिड़की / माता-पिता के दाईं ओर से तत्व के सबसे दाएं बिंदु की ऑफसेट" "। तो, सही उत्तर होगा:var rt = ($(window).width() - ($whatever.offset().left + $whatever.outerWidth()));

— ब्रेंडन क्रॉफर्ड

@BrendonCrawford आपको उस टिप्पणी को उत्तर में स्थानांतरित करना चाहिए।

— गैरी

के माध्यम से आने वाले किसी व्यक्ति को एक नोट - ऊपर दिए गए उत्तर को ब्रेंडन द्वारा की गई टिप्पणी को सही ढंग से दर्शाने के लिए संपादित किया गया है।

— क्रिस मैरास्टी-जॉर्ज

Answer 3

शायद मैं आपके सवाल को गलत समझ रहा हूं, लेकिन ऑफसेट आपको दो चर देने वाला है: एक क्षैतिज और एक ऊर्ध्वाधर। यह तत्व की स्थिति को परिभाषित करता है। तो आप क्या देख रहे हैं:

$("#whatever").offset().left

तथा

$("#whatever").offset().top

यदि आपको यह जानना होगा कि आपके तत्व की सही सीमा कहां है, तो आपको इसका उपयोग करना चाहिए:

$("#whatever").offset().left + $("#whatever").outerWidth()

Answer 4

ग्रेग ने जो कहा उसके ठीक विपरीत:

$ ("# जो भी")। ऑफसेट ()। बाएं + $ ("# जो भी हो")। आउटवर्ड ()।

इस कोड को बाईं ओर के सापेक्ष सही स्थिति मिलेगी। यदि इरादा सही पक्ष के सापेक्ष सही स्थिति प्राप्त करने का था (जैसे कि सीएसएस rightसंपत्ति का उपयोग करते समय ) तो कोड को जोड़ना आवश्यक है:

$ ("# parent_container")। इनरव्हीड () - ($ ("# जो कुछ भी" ऑफ़सेट) ()। बाएं + $ ("# जो भी")। आउटवार्ड ())

यह कोड उन एनिमेशनों में उपयोगी है जहाँ आपको एक निश्चित एंकर के रूप में दाईं ओर सेट करना होता है जब आप शुरू में rightसंपत्ति को सीएसएस में सेट नहीं कर सकते हैं।

Answer 5

वास्तव में ये केवल तभी काम करते हैं जब विंडो को ऊपर बाईं ओर से स्क्रॉल न किया गया हो।
आपको विंडो स्क्रॉल वैल्यू को घटाना है, ताकि वे पृष्ठ पर बने रहने वाले तत्वों को हटाने के लिए उपयोगी हो।

var offset = $('#whatever').offset();

offset.right = ($(window).width() + $(window).scrollLeft()) - (offset.left + $('#whatever').outerWidth(true));
offset.bottom = ($(window).height() + $(window).scrollTop()) - (offset.top + $('#whatever').outerHeight(true));

Answer 6

एक मूल DOM API है जो इसे बॉक्स से बाहर निकालता है - getBoundingClientRect:

document.querySelector("#whatever").getBoundingClientRect().right

Comments

लेकिन getBoundingClientRect दस्तावेज़ के सापेक्ष व्यूपोर्ट के सापेक्ष नहीं देता है, जो कि ऑफसेट () प्रदान करता है।

— साईं डब्बाका

Answer 7

ब्रेंडन क्रॉफर्ड का यहाँ सबसे अच्छा जवाब था (टिप्पणी में), इसलिए मैं इसे एक उत्तर तक ले जाऊंगा जब तक कि वह (और शायद थोड़ा विस्तार नहीं करता)।

var offset = $('#whatever').offset();

offset.right = $(window).width() - (offset.left + $('#whatever').outerWidth(true));
offset.bottom = $(window).height() - (offset.top + $('#whatever').outerHeight(true));

Answer 8

एक div/table (left) = $("#whatever").offset().left;- ठीक एंकर बिंदु हो रही है !

div/table (right)आप का एंकर पॉइंट प्राप्त करना नीचे दिए गए कोड का उपयोग कर सकता है।

 $("#whatever").width();