如何使純JavaScript的工具提示（onclick顯示/解僱）

Question

我需要使用一些JS沒有JQuery插件來做一個簡單的工具提示。

當我點擊圖像時，我想顯示帶有三角形角的波紋管，裏面有一些文字的圖像。

我谷歌和谷歌，但沒有找到任何東西。

只需單擊圖像顯示信息，然後點擊相同的圖像來解僱它，但無法弄清楚如何做到這一點。

Answer 1

如果你願意使用jquery，但不是一個插件，那麼可以很簡單地完成。

http://jsfiddle.net/GQE4k/

var h = false; 
$("#container").hover(function(){ 
    if (h == false){ 
     $("#popUp").fadeIn(); 
     $("#popUpText").fadeIn(); 
     h = true; 
    } 
},function(){ 
    if (h == true){ 
     $("#popUp").fadeOut(); 
     $("#popUpText").fadeOut(function(){h=false}); 
    } 
}); 

爲了點擊而不是懸停：

http://jsfiddle.net/GQE4k/1/

var h = false; 
$("#container").click(function(){ 
    if (h == false){ 
     $("#popUp").fadeIn(); 
     $("#popUpText").fadeIn(function(){h = true;}); 
    } 
    if (h == true){ 
     $("#popUp").fadeOut(); 
     $("#popUpText").fadeOut(function(){h=false}); 
    } 
});