How to prevent SlideToggle function queue?

Case: JQuery code controls an EM sliding tag (with slideToggle function) to appear on hover.

Problem: In slide mode, the freeze state sometimes stops. I referred to this article: http://www.learningjquery.com/2009/01/quick-tip-prevent-animation-queue-buildup

I tried to insert the stop () function, but this does not affect slideToggle (); But methods that work well for an animated function.

This is the code I'm working in:

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>
+3
source share
1 answer

, , #ProdImg a. .priceTag. :

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

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

, stop() . , , , .

+14

Source: https://habr.com/ru/post/1717425/


All Articles