javascript - Jquery Hover - allow hover on another DIV the appears on hover of a button -


i have homepage 4 buttons. when hovered on button, menu appears behind buttons. when hover on button, different colored menu appears in it's place.

currently, can buttons show menus, when hover onto menus (and hover off button) lose menu.

here's simple code: jquery @ top:

$(".mybutton").hover(     function () {         $(".mybox").fadein();      },     function () {         $(".mybox").fadeout();     } );  $(".mybutton2").hover(     function () {         $(".mybox2").fadein();      },     function () {         $(".mybox2").fadeout();     } ); 

and html:

<div class="mybox">   <div style="position: absolute;">    <a href="#">item 1</a>    <a href="#">item 2</a> </div> </div>  <div class="buttons"> <div class="mybutton">     /* button image here */ </div>  <div class="mybutton2">     /* button 2 image here */ </div> </div> 

so need way keep box fades in active when hovered over. thinking of not doing callback fadeout, , somehow doing fadeout if fade off .mybox div or if hover on button. it's little unclear me how accomplish that.

thanks in advance.

you need include menu , button inside container , have hover event on container. way menu visible long you're hovering on container.

here's need do. declare container menu , button both inside it.

<div id='container'>     <div class="mybox box">         <div style="position: absolute;">             <a href="#">item 1</a>             <a href="#">item 2</a>         </div>     </div>      <div class="buttons">         <div class="mybutton">             /* button image here */         </div>     </div> </div> 

here's need in jquery.

$(document).ready(function() {     $("#container").hover(         function() {             console.log($(".mybox").fadein());             $(".mybox").fadein();          },         function() {             $(".mybox").fadeout();         }     ); }); 

here's working jsfiddle 2 buttons


Comments

Popular posts from this blog

toolbar - How to add link to user registration inside toobar in admin joomla 3 custom component -

linux - disk space limitation when creating war file -

How to provide Authorization & Authentication using Asp.net, C#? -