如何讓一個div出現在另一個DIV（CSS或JavaScript）

我做了很多搜索的懸停，但這些解決方案都爲我工作。如何讓一個div出現在另一個DIV（CSS或JavaScript）

這裏是我的jsfiddle：http://jsfiddle.net/HS3jh/

我需要ABOUTTAB DIV，當你將鼠標懸停在標籤tab2可見。

#ABOUTTAB { 
    position: absolute; 
    width: 218px; 
    height: 35px; 
    margin-top: -32px; 
    margin-left: 231px; 
    visibility: hidden; 
}

隨意使用CSS或Javascript做到這一點，感謝您的任何幫助，甚至如果你需要的話弄亂HTML。

來源

2014-02-07 user3123020

您應該從[bootstrap]（http://getbootstrap.com/components/#dropdowns）查看下拉菜單 – royhowie

您的標記在其中包含'

'標記。現在是2014年。停止！ – Mathletics

你可以用一些jQuery的相當容易做到這一點。東西的

$('#tab2').hover(
    function(){ 
     $('#ABOUTTAB').show(); 
    }, 
    function(){ 
     $('#ABOUTTAB').hide(); 
    });

傳遞到懸停的第一個函數（）的效果是OnMouseEnter在處理程序，第二個是onMouseExit處理程序。所以當你懸停tab2時，會顯示ABOUTTAB，當你停止時它隱藏起來。以display:none開頭，以隱藏它。

做一些研究，jQuery的。這種DOM操作非常簡單直觀。

來源

2014-02-07 18:49:23 UpQuark

雖然這可能有效，但OP沒有明確提及jQuery的用法。他可能會或可能不需要它，這就是爲什麼我給了一個普通的JS解決方案（稍微冗長些）。 – astorije

使用純JavaScript，可以用類似的東西來實現：

document.querySelector("#tab2").addEventListener("mouseover", function() { 
    document.querySelector("#ABOUTTAB").style.visibility = "visible"; 
}); 

document.querySelector("#tab2").addEventListener("mouseout", function() { 
    document.querySelector("#ABOUTTAB").style.visibility = "hidden"; 
});

這樣，你不需要jQuery的but if you need it to work with IE < 8，用戶getElementById代替querySelector做（不要忘記刪除# ，這是id選擇器）。

來源

2014-02-07 18:55:44 astorije

這是一個選項

對JS。

<script type="text/javascript"> 
function wait(){ 
    var tab2 = document.getElementById("tab2"); 
    tab2.addEventListener('mouseover',change,false); 

} 


function change(){ 
    document.getElementById('ABOUTTAB').style.visibility = "visible"; 
} 


</script>

在這個例子中不改變爲隱藏。

，這對身體

<body onload="wait()">

當瀏覽器加載網頁充電功能。

來源

2014-02-07 19:03:53 TiGreX

如何讓一個div出現在另一個DIV（CSS或JavaScript）

回答

相關問題