Jquery mouseover和mouseout問題

Question

我正在爲我的視頻製作自定義播放暫停按鈕。但是，當我將鼠標懸停在按鈕上時，按鈕將保持閃爍。任何想法停止閃爍時，我將鼠標放在按鈕上？由於

$('#fullplay') 
 
    .mouseover(function() { 
 
     $('#playpausevideo').fadeIn(); 
 
    }) 
 
    .mouseout(function() { 
 
     $('#playpausevideo').fadeOut(); 
 
    });

.container{ 
 
    
 
    } 
 

 
.playpausevideo{ 
 
    height:100px; 
 
    width:100px; 
 
    position:absolute; 
 
    background-image:url('/../../Images/onbigplan/bigfullplay.png'); 
 
\t background-repeat:no-repeat; 
 
\t background-position:center; 
 
    cursor:pointer; 
 
    display:none; 
 
    background-color:#000; 
 
    z-index:99999; 
 
} 
 
.playpausevideo.selected{ 
 
    height:100px; 
 
    width:100px; 
 
    position:absolute; 
 
    background-image:url('/../../Images/onbigplan/bigfullpause.png'); 
 
\t background-repeat:no-repeat; 
 
\t background-position:center; 
 
    cursor:pointer; 
 
    background-color:#ff0000; 
 
    z-index:99999; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="container"> 
 
    <div id="playpausevideo" class="playpausevideo noselected"></div> 
 
<video id="fullplay" autoplay muted loop poster="" width="400px" height:="300px"> 
 
    <source src="http://www.w3schools.com/html/mov_bbb.mp4" type="video/mp4"> 
 
    <source src="http://www.w3schools.com/html/mov_bbb.ogg" type="video/ogg" /> 
 
</video> 
 

 
</div>

Answer 1

你可以換你的視頻和按鈕變成一個div，並聽取有關該div mouseenter和mouseleave事件。

下面是一個jsfiddle的例子：http://jsfiddle.net/jp5ru8vz/