jQuery的颜色拾取和CSS3渐变

Question

我有一个关于CSS3渐变和jQuery插件称为颜色选择器中的问题，

什么，我想实现的是用户可以改变图像他们所选择的梯度的背景;我已经尝试了许多解决方案，但似乎无法让渐变部分工作。

这里是开发版：http://prosperitymedia.co.uk/pm/logo.html

这里的颜色选择器：http://www.eyecon.ro/colorpicker/

请注意，我只在FF4测试的开发版本，所以我不知道是否会在其他浏览器。

这里是我的代码：

 // initial colour value 
    var gradientHexOne = '333333'; 
    var gradientHexTwo = '666666'; 




    $('#logo_gradient_1_colorSelector').ColorPicker({ 
     color: "#" + gradientHexOne, 
     onShow: function (colpkr) { 
      $(colpkr).fadeIn(500); 
      return false; 
     }, 
     onHide: function (colpkr) { 
      $(colpkr).fadeOut(500); 
      return false; 
     }, 
     onChange: function (hsb, hex, rgb) { 
      // every time a new colour is selected, this function is called 
      gradientHexOne = hex; 
      $('#logo_gradient_1_colorSelector div').css('backgroundColor', '#' + hex); 

     } 
    }); 



    $('#logo_gradient_2_colorSelector').ColorPicker({ 
     color: "#" + gradientHexTwo, 
     onShow: function (colpkr) { 
      $(colpkr).fadeIn(500); 
      return false; 
     }, 
     onHide: function (colpkr) { 
      $(colpkr).fadeOut(500); 
      return false; 
     }, 
     onChange: function (hsb, hex, rgb) { 
      gradientHexTwo = hex; 
      $('#logo_gradient_2_colorSelector div').css('backgroundColor', '#' + hex);   

     } 
    }); 

    $('#gradients').click(function(){ 
     $('#logo').css(
      '-moz-linear-gradient(100% 100% 90deg,' + '#' + gradientHexOne + ', #' + gradientHexTwo + ')' 
     ); 
    }); 

Answer 1

-moz-linear-gradient是背景图像的值，例如

$('#logo').css({'background-image' : '-moz-linear-gradient(100% 100% 90deg,' + '#' + gradientHexOne + ', #' + gradientHexTwo + ')'});