跨瀏覽器的問題

我已經創建<div>元素，我這樣做顯示/隱藏，使用Java腳本<div> ..跨瀏覽器的問題

但問題是，該位置上的所有不同的瀏覽器不同

JavaScript是如下

< script language="JavaScript" type="text/javascript"> 
var abc=false; 
function showHide() 
{ 
var a=document.getElementById("MainDiv"); 
var b=document.getElementById("myTestDiv"); 

if(abc==false) 
{ 
abc=true; 
b.style.top = a.offsetTop; 
b.style.left = a.offsetParent; 
b.style.display = "inline"; 
} 
else{ 
abc=false; 
b.style.display = "none"; 
} 
} 
</script>

HTML是如下

<div id="myTestDiv" style="border: 2px solid rgb(100, 149, 237); color:#23238e; background-color:#FFFFFF; position:absolute; width:14%; height:17%; display:none" >

來源

2011-06-10 abc

你能提供一個你的代碼的例子，以便人們可以看到發生了什麼？ – shanethehat 2011-06-10 08:20:44

爲了隱藏給定的DOM元素，你不需要它的位置。你只需要有一個參考。例如，如果這個div有一個id，你可以使用document.getElementById函數來查找它。就div的位置而言，這可能是您遇到的CSS問題。 – 2011-06-10 08:21:31

請嘗試安裝BluePrint CSS Framework並再次重試您的操作！

或交付我們問題的一些詳細信息...

來源

2011-06-10 08:20:17 metaforce

你這裏不提供足夠的信息，但無論如何，我會採取一些猜測..

b.style.display = "inline";

而不是inline ，您可能希望將其設置爲block，div是塊級元素。

別的東西去嘗試，追加px：

b.style.top = a.offsetTop + "px"; 
b.style.left = a.offsetParent + "px";

此外，還要確保你有一個適當的文檔類型爲第一行：

<!DOCTYPE html>

不這樣做，Internet Explorer的特別將無望地破碎。

來源

2011-06-10 08:43:01 thirtydot

感謝thirtydot，它的工作原理，但在google chrome – abc 2011-06-10 09:26:57

@abc中略有不同：爲了幫助你，我需要看看你有什麼。將整個HTML粘貼到[JS Bin]（http://jsbin.com/）中，並在''中包含任何相關的CSS。 – thirtydot 2011-06-10 09:31:16

爲什麼b.style.left = a.offsetParent;？ https://developer.mozilla.org/en/OffsetParent

我想你想要b.style.left = a.offsetLeft;。無論如何，爲什麼你使用JavaScript呢？難道你不能設置MainDiv的position: relative;和myTestDiv的top: 0; left: 0;？

來源

2011-06-10 09:31:59 atlavis

我很尷尬，我沒有注意到'b.style.left = a.offsetParent'。 – thirtydot 2011-06-10 09:40:07

跨瀏覽器的問題

回答

相關問題