如何爲選項卡設置漸變顏色？

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/