[英]Jquery mouseover and mouseout issue
I was making a custom play pause button to my video . 我正在为视频创建自定义播放暂停按钮。 However when I mouse over the button the button will keep blinking .
但是,当我将鼠标悬停在按钮上时,按钮将继续闪烁。 Any idea stop the blinking when I mouse over the button ?
当我将鼠标悬停在按钮上时,是否有任何想法可以停止闪烁? Thanks
谢谢
$('#fullplay') .mouseover(function () { $('#playpausevideo').fadeIn(); }) .mouseout(function () { $('#playpausevideo').fadeOut(); });
.container{ } .playpausevideo{ height:100px; width:100px; position:absolute; background-image:url('/../../Images/onbigplan/bigfullplay.png'); background-repeat:no-repeat; 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'); background-repeat:no-repeat; 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>
You could wrap your video and button into a div, and listen mouseenter
and mouseleave
events on that div. 您可以将视频和按钮包装到div中,并在该div上监听
mouseenter
和mouseleave
事件。
Here's a jsfiddle example : http://jsfiddle.net/jp5ru8vz/ 这是一个jsfiddle示例: http : //jsfiddle.net/jp5ru8vz/
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.