使用jQuery或PHP檢測較深或較淺的背景色

Question

這個有點困難。我做了一個網站演示樣式切換器，改變特定的div背景顏色。一切正常，但由於該div還包含文本和標題，如果訪問者將背景改爲白色，則標題和文本消失。

因此，而不是添加切換標題或該容器的文本，身份證，而是檢測背景顏色的變化，這種方式會影響裏面的文字。

通過使用Tyny顏色jQuery插件，我將標題和段落的顏色設置爲輕30％，並且幾乎可以正常工作，但一旦您變爲白色或接近白色的任何方式，我都需要將它切換爲黑色。

有沒有什麼辦法通過使用jQuery TinyColor和Colorpicker插件或php來檢測較暗/較淺的顏色代碼？我之所以要求php的原因是因爲我將該演示程序移植到了php，所以任何一個人都可以爲我工作。

我已經建立了小的演示這裏爲大家測試 http://jsfiddle.net/mwVz6/12/

代碼非常簡單和演示和我的切換器，我使用拾色器從 http://www.eyecon.ro/colorpicker/

$('#colorSelector').ColorPicker({ 
    color: '#0000ff', 
    onShow: function (colpkr) { 
     $(colpkr).fadeIn(500); 
     return false; 
    }, 
    onHide: function (colpkr) { 
     $(colpkr).fadeOut(500); 
     return false; 
    }, 
    onChange: function (hsb, hex, rgb) { 
     $('#container').css('backgroundColor', '#' + hex); 
    } 
}); 

Answer 1

難道這是對你有什麼用？

https://github.com/joggink/jquery-colorcontrast

http://24ways.org/2010/calculating-color-contrast/

你最好的選擇可能是開發一種計算2種特定顏色有多接近彼此的增量（差異）的功能。如果增量低於某個閾值，則將文本顏色增加到此閾值。挑戰在於確定顏色是否應該更深或更淺。