Question

I am trying to create a cart link where the shopping cart opens out on hover. I am able to get the cart to open out on hover and close when moving away. However I cannot get the cart block to stay open once hovered over. I would like the car block to open out on hover and stay open if you hover over it. You will see what I mean if you hover over the cart link in the top right corner of this page.

rel=“nofollow”http://dl.drop Box.com/u/4380589/Rococlothing/index.html

The jQuery I am using is:

jQuery( #cart-links .links .first a ).mouseover(function(){
  jQuery( .block-cart ).slideDown(400);
}).mouseout(function(){
  jQuery( .block-cart ).slideUp(400);
});

jQuery(".block-cart").mouseover(function(){
 jQuery(this).show();
}).mouseout(function(){
 jQuery(this).fadeOut("slow");
});

Answer 1

hovered = false;

jQuery( #cart-links .links .first a ).mouseover(function(){
    jQuery( .block-cart ).slideDown(400);
}).mouseout(function(){
      setTimeout(function(){
      if(!hovered) {
        jQuery( .block-cart ).slideUp(400);
      }}, 250);
   });

jQuery(".block-cart").mouseover(function(){
 hovered = true;
}).mouseout(function(){
 hovered = false;
 jQuery( #cart-links .links .first a ).trigger("mouseout");
});

Answer 2

You need to cancel the first mouseout() so you ll need adjust the second part to

jQuery(".block-cart").mouseover(function(){
 jQuery(this).stop(true).show();
}).mouseout(function(){
 jQuery(this).fadeOut("slow");
});

请注意<编码>, 我顺便说一遍,它清除了目前的估算。 j Query doc for end is @ 。

Answer 3

It looks like the .block-cart is not a child of the element that triggers the hover, so in order to keep the hover state active you d have to structure your HTML in a way that the .block-cart is a child element of the element that triggers the hover.

Btw: why don t you use $(this).hover() instead of $(this).mouseover().mouseout(), it s a little easier

友情链接