Lampeggiamento solo su .hover(), inizia ma non riesco a fermarlo!

otto9due

Utente Attivo
22 Feb 2014
591
25
28
Sto tentando di produrre il lampeggiamento di un div ( contenente un prezzo in offerta ) solo all'hover del mouse su un terzo div ( ad esempio: all'hover del mouse sul bottone acquista, il div contenente il prezzo lampeggia ).
Ho scritto questo:

HTML:
jQuery(document).ready(function( $ ){   
    var myTimer = function(){
                    $("span.prezzo").fadeOut('slow', function(){
                        $("span.prezzo").fadeIn('slow');
                    });   
                  };   
        $("div.scopri-offerta-code").hover( function() {
                setInterval(myTimer, 1000);
        }, function(){
            clearInterval(myTimer);
    });
});

Ora il risultato è che: all'hover mi parte effettivamente il setInterval() facendo lampeggiare il div, ma uscendo dall'hover non parte clearInterval(), o almeno credo.. In pratica parte il lampeggiamento e non si ferma più o_O..

Ho provato e riprovato diverse volte in modo diverso ma nulla.. Qualcuno ha qualche idea?
 
Ultima modifica:
Provato anche così, tramite alcuni suggerimenti reperiti qui sul forum, ma nulla..
HTML:
function blink(selector){
  $(selector).fadeOut("slow", function(){
    $(this).fadeIn("slow", function(){
      blink(this);
    });
  });
}

jQuery(document).ready(function( $ ){
    $( "div.scopri-offerta-code" ).hover(function() {
        blink("span.prezzo");
    });
});

Continua a reiterarsi all'infinito..

e neanche questa va...

HTML:
var tid = setInterval(lamp, 2000);   
function lamp() {
        $("span.prezzo").fadeOut('slow', function(){
            $("span.prezzo").fadeIn('slow');
                lamp();
        });
}
function abort() {
  clearInterval( tid );
}   

jQuery(document).ready(function( $ ){   
    $("div.scopri-offerta-code").hover( function() {
                lamp();
        }, function(){
                abort();
    });
});
 
Ultima modifica:
Mi sono scervellato e alla fine ce l'ho fatta, così funziona, il div lampeggia finalmente solo all'hover del mouse finendo di lampeggiare quando esco con il mouse.
Ecco il codice che funziona:

HTML:
setInterval(function(){
    var $divCont = $("div.scopri-offerta-code");
    if($divCont.is(":hover")) {
               $("span.prezzo").fadeOut('slow', function(){
            $("span.prezzo").fadeIn('slow');
        });
    }
    else {
       $("span.prezzo").fadeIn('slow');
    }
}, 200);
 

Discussioni simili