javascript - Keep hover event after click event is triggered Jquery -
so having little problem. have bunch of div 's same class , made that, when mouse on them, gain border , when mouse off lose same border. thing added click event them once click on them, no longer respond wether mouseenter/mouseleave events nor click events. in other words after first click, events gone.
here div 's
<div class="hover-div series-div image-series-div"> <img class="slide-div-series-image" src="../../imagens/pbserie.jpg"> <b class="slide-font">serie lel</b> </div> <div class="hover-div series-div image-series-div"> <img class="slide-div-series-image" src="../../imagens/stargateatlserie.jpg"> <b class="slide-font">serie lel</b> </div> <div class="hover-div series-div image-series-div"> <img class="slide-div-series-image" src="../../imagens/stargateatlserie.jpg"> <b class="slide-font">serie lel</b> </div> <div class="hover-div series-div image-series-div"> <img class="slide-div-series-image" src="../../imagens/stargateatlserie.jpg"> <b class="slide-font">serie lel</b> </div> <div class="hover-div series-div image-series-div"> <img class="slide-div-series-image" src="../../imagens/stargateatlserie.jpg"> <b class="slide-font">serie lel</b> </div>
and here jquery handle events
$(".hover-div").on({ click: function() { buildpage($(this).prop("id")); }, mouseenter: function() { var width = $(this).width(); var height = $(this).height(); $(this).css("box-shadow", "0 0 0 2px white inset"); }, mouseleave: function() { var width = $(this).width(); var height = $(this).height(); $(this).css("box-shadow", "none"); } });
does know how fix this?
thanks in advance
edit: ok know sure problem relies on click event. triggers once , kind of disables other events also?
after quick test think code ok can use different box-shadow color this:
$(this).css("box-shadow", "0 0 0 2px red inset");
you can see red box on div hovered.
Comments
Post a Comment