相关疑难解决方法(0)

在HTML5或Canvas(或任何其他HTML5技术)的帮助下,是否有人有一个很好的解决方案来改变非透明区域的颜色.

我google了很多,发现了一些可以改变图像颜色的解决方案(使用Canvas),比如

如何使用HTML5 Canvas为图像着色？

画布 - 使用HTML5/CSS/JS更改图像的颜色？

但是这些解决方案也将透明背景改变为给定的颜色(我不想要).

它是一个具有透明背景的stackoverflow png图像.现在,我想改变图像颜色而不影响它的透明像素(背景),这样我就可以toDataURL借助新方法的canvas 方法再次保存图像.

我不确定是否可以使用HTML5.任何帮助都非常感谢.

提前致谢.

*******************EDITED*********************

添加了新的药丸图像(胶囊).

我想知道是否有人知道使用JavaScript重新着色图像的方法.将图像的像素的任何类型的访问会的工作,我想,只要我能读/写的颜色值.它应该在Firefox中工作; 如果它在IE中不起作用,没什么大不了的,但如果确实如此,那将是一个好处.

谢谢您的帮助!

我正在使用jquery滑块通过着色将我的图像颜色从蓝色更改为红色（范围为-100到100）。这意味着当滑块值为0时，图像应看起来正常（默认为一），并根据滑块的值从蓝色（-100）变为（100）。

在本地，我能够将图像加载到画布中（由于某种原因图像未加载到jsfiddle上）。

主要问题是当前代码未按预期修改颜色。

http://jsfiddle.net/q3qw1c0o/3/

   $(function(){

    var currentValue = $('#currentValue');


   $( "#slider" ).slider({
        range: "max",
        min: -100,
        max: 100,
        value: 0,
        slide: function( event, ui ) {
            $( "#sliderValue" ).val( ui.value );
            $(ui.value).val($('#sliderValue').val());
            changeIt(ui.value);
        }
        });

    $("#sliderValue").change(function() {
    $("#slider").slider("value" , $(this).val())
    });

});

 var x; //drawing context
var width;
var height;
var fg;
var buffer

window.onload = function() {
    var drawingCanvas = document.getElementById('myDrawing');
    // Check the element is in the DOM and the browser supports canvas
    if(drawingCanvas && drawingCanvas.getContext) {
        // …