jquery Highlight Fading - Timeout Problem

Question

Ich habe zwei Sätze von boxex auf einer Seite. 10 Boxen in Klasse ‚boxOne‘ und weitere 10, die zu Klasse ‚boxTwo‘
Es gibt eine Taste. Auf Schaltfläche anklickt verblasst Ich bin mit jquery Effekt zu markieren und dann die Hintergrundfarbe alle Elemente der Klasse ‚Boxone‘ und ‚Boxtwo‘.

Im Folgenden finden Sie den Code ein.

var colorOfBox1 = "'" + $(.boxOne).css('backgroundColor') + "'";  
$(.boxOne).animate(
    { 'backgroundColor': "#FF9900" }, 
    { 'queue': false, 'duration': 1000 });

setTimeout( function(){  
        $(.boxOne).animate(
          { 'backgroundColor': colorOfBox1}, 
        {'queue': false, 'duration': 2000} 
      );
}, 2000);

var colorOfBox2 = "'" + $(".boxTwo).css("backgroundColor") + "'";  
$('.boxTwo').animate({ 'backgroundColor': "#FF9900" }, {'queue': false, 'duration': 1000});  
  setTimeout(
    function(){
        $('.boxTwo).animate(  
            { 'backgroundColor': colorOfBox2 }, 
                {'queue': false, 'duration': 2000} 
          );
}, 2000);

Alle Boxen mit der angegebenen Farbe auf Klick auf den Button hervorgehoben werden .. Nun ist das Problem, dass manchmal einige aus diesen Boxen verblassen nicht. Deren Hintergrund bleibt hervorgehoben. Dies geschieht manchmal ohne Konsistenz. Ich möchte ein konsistentes Verhalten.

Ich sehe, dass die Funktion setTimeout () nicht einheitlich die Elemente auf alle angewendet wird, zu dieser Klasse gehören, ... Es ist apllied nur wenige elments ..
Welche Fehler mache ich?

Answer 1

Jetzt verwende ich dieses Plugin und es funktioniert gut.

http://jquery.offput.ca/highlightFade/old.php

Answer 2

Vielleicht die Syntax des Javascript-Code überprüfen Sie zuerst. Uneinheitliche Syntax verursacht inkonsistente Ergebnisse auf verschiedenen Browsern.

Answer 3

Sie scheinen ein paar Anführungszeichen um .boxOne und .boxTwo an einigen Stellen fehlen. Nicht sicher, ob das ein Formatierungsfehler oder beabsichtigt war. causeing Probleme mit einigen Browsern könnte.