jquery colorpicker 和 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 + ')'});