views:

372

answers:

0

Case: Jquery code manage a sliding EM tag (with slideToggle function) for its appearing on hover.

Problem: The slideToggle sometimes queue the hover state. I referred to this article: http://www.learningjquery.com/2009/01/quick-tip-prevent-animation-queue-buildup

I tried to insert stop() function, but this not affect slideToggle(); But the methods it'going good for animate function.

This is the code where i working on:

Jquery Code:

$(document).ready(function() {
    $('#ProdImg a .priceTag').slideUp(); 

    $('#ProdImg a').mouseover(function() {
     $(this).stop().find('.priceTag').slideToggle();
    });

    $('#ProdImg a').mouseout(function() {
     $(this).stop().find('.priceTag').slideToggle();
    });
});

HTML code:

<div id="ProdImg" style=" height:240px;">
    <a title="TEXT" href="TEXT_URL" style="position:absolute; margin-left:10px;">
    <em style="text-align:right; color:#666;" class="priceTag">
     <div class="colorGoldGradient" style="width:100%;">
      <div class="rightGoldGradient" style="width:100%;">
       <div class="leftGoldGradient" style="width:100%;">
        <div style="padding-left:5px; padding-right:10px;">Prezzo:<br />
        TEXT
        </div>
       </div>
      </div>
     </div>
    </em>
    <span class="offertaTag"><span>
    </a>
</div>