2
我一直在尋找一種方法來將我的整個css樣式表從顏色值轉換爲它們各自的灰度值 - 但是我無法找到一個好方法(除了打開Photoshop並以這種方式實現)。jQuery插件將顏色CSS轉換爲灰度?
有沒有辦法做到這一點,有沒有人知道如果有一個jQuery腳本可以做到這一點?
注:這不是一個關於如何將彩色圖像向灰度圖像,這是關於轉換的完整樣式表爲灰度的問題。
我一直在尋找一種方法來將我的整個css樣式表從顏色值轉換爲它們各自的灰度值 - 但是我無法找到一個好方法(除了打開Photoshop並以這種方式實現)。jQuery插件將顏色CSS轉換爲灰度?
有沒有辦法做到這一點,有沒有人知道如果有一個jQuery腳本可以做到這一點?
注:這不是一個關於如何將彩色圖像向灰度圖像,這是關於轉換的完整樣式表爲灰度的問題。
這是一個Javascript函數,它將採用RGB值並返回不飽和的RGB值。
function desaturate(r, g, b) {
var intensity = 0.3 * r + 0.59 * g + 0.11 * b;
var k = 1;
r = Math.floor(intensity * k + r * (1 - k));
g = Math.floor(intensity * k + g * (1 - k));
b = Math.floor(intensity * k + b * (1 - k));
return [r, g, b];
}
如果你想在一個犯規一舉去色特定的元素,你可以這樣做:
function rgb_to_string(r, g, b) {
return 'rgb(' + r + ', ' + g + ', ' + b + ')';
}
function desaturate_element(selector) {
var fg = $(selector).css('color').match(/\d+/g);
var bg = $(selector).css('background-color').match(/\d+/g);
$(selector).css('color', desaturate(fg[0], fg[1], fg[2]));
$(selector).css('background-color', desaturate(bg[0], bg[1], bg[2]));
}
在this JSFiddle在操作中查看。那些去飽和倍數來自this thread。
另一件事,k
價值是多少你想去飽和。 1將完全去飽和,並且0根本不會去飽和。
這可能有幫助,但我沒有使用它自己。 http://james.padolsey.com/demos/grayscale/ – Seabass