1

特定のタブのグラデーション カラーを設定する必要があります。最初のタブから最後のタブまでのグラデーション カラーが含まれています。これを設定するにはどうすればよいですか。そのために、以下のコードを使用しました

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

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

しかし、問題は 1 つのタブに 1 つの色しか含まれていないことです。最初のタブから最後のタブまでグラデーション カラーが必要です。どうすればよいですか?

4

1 に答える 1

2

簡単！

必要なのは線形グラデーションの 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/

于 2013-04-29T06:40:44.007 に答える