2009-07-31 5 views
5

में ऑफसेट लेफ्ट और ऑफ़सेटटॉप समस्या का सामना करना एक टूलटिप बनाने की कोशिश करते समय ऑफसेट लेफ्ट और ऑफ़सेट टॉप समस्या का सामना करना पड़ता है जो हर बार कैलेंडर पर विभिन्न घटनाओं पर क्लिक करते समय बनाएगा .. निम्नलिखित कोड है जो फ़ायरफ़ॉक्स के लिए अच्छा काम करेगा लेकिन बनाना आईई के लिए समस्या। मुझे इस के लिए समाधान बता सकते हैं ..आईई

var ttip = __createElement("div","ttipbox","ttipbox"); //creating div 
target = document.getElementById("sDiv"+ndiv); //taking the object of event on click of it tooltip has to display. 

var x = target.offsetLeft ; 
var y = target.offsetTop - (currObj.childNodes[2].childNodes[0].childNodes[1].scrollTop + ttip.offsetHeight); 
ttip.style.top= y+15; 
ttip.style.left= x - 80; 
ttip.style.zIndex= "2000"; 

अग्रिम धन्यवाद

+0

समस्या क्या है? क्या यह गलत स्थिति में दिखाई देता है? या बिल्कुल नहीं? – scunliffe

+0

सामान्य रूप से पीएस मैं 'पीएक्स' प्रत्यय सहित एक स्ट्रिंग के रूप में शीर्ष/बाएं मान सेट करता हूं। जैसे ttip.style.top = (y + 15) + 'px'; – scunliffe

+0

यह गलत स्थिति में दिखाई देता है ... – Abhimanyu

उत्तर

0

कुछ नोट:

1.) आप एक DOCTYPE सेट किया है? यदि नहीं, तो आप क्विर्क मोड में होंगे जो आईई चीजों को प्रस्तुत करने के तरीके को बदल देता है। DOCTYPE को जोड़ने से IE को "अधिक" मानकों को प्रस्तुत करने के लिए मजबूर किया जाएगा।

2.) 'पिक्सल' जोड़ने की कोशिश करो; शीर्ष/बाएं सेट करते समय प्रत्यय। ज्ञात मुद्दे हैं (मैं फ़ायरफ़ॉक्स के साथ विश्वास करता हूं) कि कुछ मामलों में इकाइयों को निर्दिष्ट नहीं करना अजीब व्यवहार का कारण बनता है।

3.) जैसे सत्यापित करें यहां तक ​​कि एक चेतावनी() के साथ कि IE में x, और y मान वह हैं जो आप उम्मीद कर रहे हैं।

var x = ...; 
var y = ...; 
alert('x:' + x + ', y:' + y); 

उपर्युक्त 3 वस्तुओं के कुछ उत्तरों के साथ, हम समस्या को और जानकारी/हल करने में सक्षम होना चाहिए।

1

यही कारण है कि आप एक डोम पुस्तकालय का उपयोग करें।

पहले संभावित समस्या मैं देख सकता हूँ कोड है

currObj.childNodes[2].childNodes[0].childNodes[1] 

केवल एक क्रॉस-ब्राउज़र फैशन में काम करेंगे अगर आप अपने डोम वृक्ष में कोई "खाली स्थान के" है, के बाद से आईई पर ध्यान नहीं देता html "खाली स्थान के" जब पॉप्युलेट childNodes संपत्ति है, जबकि अन्य नहीं है:

<div id="mydiv"> 
    <span>Hello World</span> 
</div> 

आईई रिपोर्ट करेंगे 1 mydiv.childNodes.length के रूप में (<span>), बाकी सब 3 ("\n", <span>, "\n")।

Inconsistent Whitespace Text Nodes in Internet Explorer

देखें दूसरे, @scunliffe's answer देखते हैं।

0

हाय यह संबंधित नहीं किया जा सकता है, लेकिन मैं मैं एक समाधान है कि मेरे लिए विशेष रूप से काम किया है IE7, सभी अन्य ब्राउज़र IE7 को छोड़कर काम पोस्ट होगा सोचा।

मेरे लिए IE7 में target.offsetTop वापस अन्य ब्राउज़र जैसे लक्ष्य तत्व की तुलना में कम अन्य तत्वों

<div id="maindiv"> 
<input type="hidden" id="droptext" /> 
<input type="hidden" id="dropvalue" /> 
<div id="targetitems"> 
    <div id="targets"> 
    <div id="target_1"></div> 
    <div id="target_2"></div> 
    </div> 
</div> 
</div> 

//IE7 
var target = ($("#target_1").length > 0) ? $("#target_1")[0] : null; 
if (target != null){ 
var targetTop = target.offsetTop; //e.g 14 
} 

//IE8 and Others same object but offsetTop was much larger 
var target = ($("#target_1").length > 0) ? $("#target_1")[0] : null; 
if (target != null){ 
var targetTop = target.offsetTop; //e.g 358 
} 
IE7 में

इसलिए अंदर नीडिंत है आ रहा था आप target.parentNode.offsetTop हो और जोड़ने की जरूरत यह target.offsetTop उदाहरण के लिए:

var targetTop = 0; 
var target = ($("#target_1").length > 0) ? $("#target_1")[0] : null; 
if (ie7){ 
targetTop = target.offsetTop + target.parentNode.offsetTop + target.parentNode.parentNode.offsetTop //will be determined by number of parents. 
}else{ 
targetTop = target.offsetTop; 
} 

वैसे भी इस में मदद करता है किसी को निश्चित रूप से मुझे मदद मिली या बहुत ही अलग मुद्दा यद्यपि उम्मीद है।

3

IE में मदद करनी चाहिए:

var obj = target.getBoundingClientRect(); 
var left = obj.left; 
var top = obj.top; 
+1

यह आईई 7 में बहुत अच्छा काम करता है, जब ऑफसेट टॉप और ऑफ़सेट लेफ्ट 0 –

+0

यह एक समाधान है लेकिन तत्व दृश्य स्थिति बदल दी गई है, जैसे कि अगर यह एक परिवर्तन है तो काम नहीं करता है –