Question

目的是写一把双管连接起来的支架(us)。

我现在说的是:

var $second_row = $( table tr:eq(1) ),
    target_color =  PaleGreen ,
    original_color = $second_row.css( background-color );

$second_row.css( background-color , target_color);
scheduleOriginalColor();

function scheduleTargetColor() {
    setTimeout(function() {
        $second_row.css( background-color , target_color);
        scheduleOriginalColor(true);
    }, 500);
}

function scheduleOriginalColor(stop) {
    setTimeout(function() {
        $second_row.css( background-color , original_color);

        if (!stop) {
            scheduleTargetColor();
        }
    }, 500);
}

rel=“nofollow> http://jsfiddle.net/zerkms/ecfMU/1/。

但是,它看着,我确信,有更好的写法。

任何建议?

rel=“nofollow”>。

var $second_row = $( table tr:eq(1) ),
    target_color =  PaleGreen ,
    original_color = $second_row.css( background-color );

setRowColor(target_color, 500);
setRowColor(original_color, 1000);
setRowColor(target_color, 1500);
setRowColor(original_color, 2000);

function setRowColor(color, timing) {
    setTimeout(function() {
        $second_row.css( background-color , color);
    }, timing);
}

Answer 1

采用<代码>toggleClass和背景说明:

var blink = setInterval(function() {
    $( table tr:eq(1) ).toggleClass( highlight );
}, 500);
setTimeout(function() {
    clearInterval(blink);
}, 2100); // run 4 times, added a little padding time just in case

.highlight {
    background-color:PaleGreen;
}

http://jsfiddle.net/ecfMU/10/>。

Answer 2

下面请你说明内容、颜色、闪光次数和速度。另一项附加福利是,它不要求任何酒类。在你能够的时候,航道支持 raw原。

function flashBG( e, c, x, z ) {
  var d = e.style.backgroundColor, i = 0, f = setInterval(function(){
    e.style.backgroundColor = ( e.style.backgroundColor == d ) ? c : d ;
    ++i == ( x * 2 ) && clearInterval( f );
  }, z );
}

要求这样做:

flashBG( document.body, "PaleGreen", 2, 500 );

Demo:

在可读性方面,以下内容可能更具有教育意义:

function flashBG( element, color, flashes, speed ) {
  var original = element.style.backgroundColor;
  var counter  = 0;
  var interval = setInterval(
    function() {
      if ( original === element.style.backgroundColor ) {
        element.style.backgroundColor = color; 
      } else {
        element.style.backgroundColor = original;
      }
      if ( ++counter == ( flashes * 2 ) ) {
        clearInterval( interval );
      }
    }, speed );
}

Answer 3

Javascript isn t my forte——因此,我可能得到一夫一妻的错误。

EDIT: Demonstration EDIT #2: Easily extensible - rainbow version

然而,这样做的一个非常简单的方式是,它具有阵列的颜色,而且具有指数的 in。这样,只有一项既定职能,如:

//Somewhere else we have:
//var colorArray = blah... blah.. blahh, it has values [palegreen,regularwhite]

//blah blah scheduleColor(0);
//var numBlinks = 2;

//then for your scheduler
function scheduleColor(ind) {
    $second_row.css( background-color , colorArray[ind % colorArray.length]);
    if (ind < (colorArray.length * numBlinks) - 1) {
        setTimeout(function() {
            scheduleColor(ind + 1);
        }, 500);
    }
}

基本想法不是两个编程者,即你们有的放矢。作为附加物,你可以轻松地把你想要的几倍或多彩的循环联系起来。

如果你想要,你就可以通过雨水循环。

Edited for some syntax/corrections.

Answer 4

我对你的回答是韦斯利的港曼托乌和里卡多的回答,因此,我无法为之 much。 I m .delay()和.queue()以及toggleClass()。我认为,它最终形成了一套法典。

一些中心:

.highlight {
    background-color:PaleGreen;
}

和联合材料:

var $second_row = $( table tr:eq(1) );

function blink(el) {
    el.addClass( highlight );
    for(i=0; i<3; i++) {
        el.delay(500).queue(function() {
            $(this).toggleClass( highlight );
            $(this).dequeue();
        });
    }
}

blink($second_row);

http://jsfiddle.net/luhn/S7SZM/2/“rel=“nofollow”>。

Answer 5

var $second_row = $( table tr:eq(1) ),
    target_color =  PaleGreen ,
    original_color = $second_row.css( background-color );


$second_row.css( background-color , target_color).delay(500).queue(function(){
    jQuery(this).css( background-color , original_color);
});

Working : Fiddle

Answer 6

您能补充 j子。

如果是的话,你可以总结一下顺利过渡的背景。

rel=“nofollow> http://jsfiddle.net/ecfMU/18/。

友情链接