如何为选项卡设置渐变颜色？

Question

我必须设置特定选项卡的渐变颜色。它包含从第一个选项卡到最后一个选项卡的渐变颜色。如何设置此选项。 对于我用下面的代码

$(function() { 
    $("#tabs").tabs(); 

     $('.gradient_me').each(function(index) { 
      var color = 255-index*75; 
      $(this).css('background', 'rgb('+color+', 0, 0)'); 
     }); 
    }); 

但问题是一个选项卡只包含一个color.I要从第一渐变色到最后我tab.How能做到这一点？

Answer 1

简单！

所有你需要的是一个线性渐变CSS规则。

$(function() { 
    $("#tabs").tabs(); 

     $('.gradient_me').each(function(index) { 
      var color = 'rgb(' + (255-index*75) + ', 0, 0)'; 
      var color2 = 'rgb(' + (255-index*75 - 75) + ', 0, 0)'; 
      $(this).css('background', '-moz-linear-gradient(left, '+color+', ' + color2 +')'); 
      $(this).css('background', '-webkit-linear-gradient(left, '+color+', ' + color2 +')'); 
      $(this).css('background', '-ms-linear-gradient(left, '+color+', ' + color2 +')'); 
      $(this).css('background', '-o-linear-gradient(left, '+color+', ' + color2 +')'); 
      $(this).css('background', 'linear-gradient(left, '+color+', ' + color2 +')'); 

     }); 
    }); 

演示：http://jsfiddle.net/5zfyU/8/