css懸停能見度出格

Question

我有一個關於能見度的問題。我必須從小提琴創建這個DEMO。

如果你點擊我的演示，你可以看到有一個圖像。當你將鼠標放在這個圖像上時，氣泡就會打開。但是，如果您將鼠標放在圖像的左側，空白氣泡會再次打開。我該如何解決這個問題？

.balon 
{ 
    position: absolute; 
    width: 345px; 
    height: auto; 
    padding: 3px; 
    background: #FFFFFF; 
    -webkit-border-radius: 2px; 
    -moz-border-radius: 2px; 
    border-radius: 2px; 
    border: #d8dbdf solid 1px; 
    -webkit-box-shadow: -1px 1px 1px 0px rgba(216, 219, 223, 0.52); 
    -moz-box-shadow: -1px 1px 1px 0px rgba(216, 219, 223, 0.52); 
    box-shadow:   -1px 1px 1px 0px rgba(216, 219, 223, 0.52); 
    visiblility: hidden; 
    opacity:0; 
    margin-left: -345px; 
    z-index:5; 
    -webkit-transition: all .3s ; 
    -moz-transition: all .3s ; 
    -ms-transition: all .3s ; 
    -o-transition: all .3s ; 
    transition: all .3s ; 
} 

.balon:after 
{ 
    content: ''; 
    position: absolute; 
    border-style: solid; 
    border-width: 10px 0 10px 10px; 
    border-color: transparent #fff; 
    display: block; 
    width: 0; 
    z-index: 1; 
    right: -10px; 
    top: 16px; 
} 

.vizyon_bg:hover .balon 
{ 
    opacity:1; 
    visibility:visible; 
    z-index:5; 
    transition: opacity .5s linear .5s; 
    -webkit-transition: opacity .5s linear .5s; 
    -moz-transition: opacity .5s linear .5s; 
    -ms-transition: opacity .5s linear .5s; 
} 

Answer 1

老兄我找到了解決方案！只需更換你的balon的CSS，你就完成了！你錯了z-index：}

我爲你創建了JSFiddle！ http://jsfiddle.net/9pgqc24c/

.balon 
{ 
position: absolute; 
width: 345px; 
z-index:-99999; 
height: auto; 
padding: 3px; 
background: #FFFFFF; 
-webkit-border-radius: 2px; 
-moz-border-radius: 2px; 
border-radius: 2px; 
border: #d8dbdf solid 1px; 
    -webkit-box-shadow: -1px 1px 1px 0px rgba(216, 219, 223, 0.52); 
-moz-box-shadow: -1px 1px 1px 0px rgba(216, 219, 223, 0.52); 
box-shadow:   -1px 1px 1px 0px rgba(216, 219, 223, 0.52); 
    visiblility:hidden; 
    opacity:0; 
    margin-left:-345px; 
    z-index:-1; 
    -webkit-transition: all .3s ; 
     -moz-transition: all .3s ; 
     -ms-transition: all .3s ; 
     -o-transition: all .3s ; 
     transition: all .3s ; 
}