javascript - Is it possible to do a real time on hover function? -
i have div #conteudo , 2 links #linkprev , #linknext.
when hover on link, .animate() left or right div #conteudo.
html:
<div id="conteudo"> <div class="boxes" id="content1"> <div class="boxes" id="content2"> <div class="boxes" id="content3"> </div> <a id="linkprev" class="linksnav"></a> <a id="linknext" class="linksnav"></a> css:
#conteudo{width:2000;position:relative; height:1080px;} .box{width:0; overflow:hidden; float:left;} js:
$('#linknext').on({ mouseenter: function(){ if ($('#conteudo .boxes').hasclass('ativo')) { $('#conteudo .boxes').removeclass('ativo'); $('.boxaberto').animate({width:'0'},600, function(){ console.log('sad') }); } else { this.iid = setinterval(function() { if (cont > -565) { cont -= 5; $('#conteudo').attr('style','left:'+cont+'px'); console.log(cont) } if (cont <= -565){ $('#linknext').hide(); } }, 0); } }, mouseleave: function(){ this.iid && clearinterval(this.iid); } }); if user clicks .boxes, it'll add class .ativo , .animate({width:x},600) clicked div.
the problem is, when hover of links, if .boxes has class '.ativo' should close box width:0 , put callback function continue .animate() left or right. closes box. have mouseleave , hover continues .animate right or left.
can me?
ps: mentioned function #linknext, #linkprev function working. prevent big text.
Comments
Post a Comment