根據動態設置的背景顏色更改文本顏色的值

比方說，我有一個日曆 - 每個條目都具有不同的背景顏色（每個用戶一種顏色）。有淺色和深色的背景色，用戶可以選擇他喜歡的顏色。現在我想設置適合背景風格的文本顏色。我在哪裏以及如何開始？先謝謝你。根據動態設置的背景顏色更改文本顏色的值

2012-06-15 user1385890

請正確標記您的問題。 – BoltClock

如果您正在尋找的情況下的解決方案的情況下，你可以做這樣的事情：

$("#Calendar .day").each(function() { 
    var $this = $(this); 

    //If the background color is black - set text color to white. 
    if($this.css("background-color") == "#000000") { 
     $this.css("color", "#FFFFFF"); 
    } 

    //A bunch more if statements 

});

ALSO

爲了方便，你可以使用此代碼中找到互補色：

JS function to calculate complementary colour?

來源

2012-06-15 20:49:35

+1只是爲了那個鏈接...這個問題過於寬泛，可以通過多種方式解決。 – lucuma

你可以嘗試只服用選擇素的按位反特德顏色。

我認爲這個片段（在JavaScript中）可以做到這一點。

var RGB_Value = "ffaacc" //set this var to the hex value the user selected 
var colorNum = parseInt(RGB_Value, 16); // assume radix of 16 (hex) and convert string to number 
var inverseColor = ~colorNum; //bitwise inverse of the number 
var RGB_Inverse = nMyNumber.toString(16); //convert the number into a hex string

來源

2012-06-15 21:30:44 Joe

聽起來不錯 - 讓我更深入：我在Joomla工作，使用一個名爲DP日曆的組件。我還使用社區生成器，其中列出了成員配置文件 - 一個配置文件字段用於設置背景色 - 我只爲文本顏色值添加了第二個配置文件字段。字段值被稱爲DP日曆 - 所以該片段仍然工作？我在JS中不太好 - 對於PHP和CSS來說，我更接近一些。但是，感謝這麼遠。 – user1385890

您應該可以在PHP方面做一些功能類似的功能;訣竅就是確保顏色的RGB分量被視爲數字而不是字符串，然後進行按位倒數。它會爲你提供反色，而不是補色。我不是一個設計師，所以我不知道區別有多重要:) – Joe

嗯，實際上沒有區別:) – user1385890

根據動態設置的背景顏色更改文本顏色的值

回答

相關問題