Skip to content

Instantly share code, notes, and snippets.

@pixelbart
Created November 30, 2016 13:24
Show Gist options
  • Select an option

  • Save pixelbart/47ab01e5fa77afec7a9e80bf1701a7d6 to your computer and use it in GitHub Desktop.

Select an option

Save pixelbart/47ab01e5fa77afec7a9e80bf1701a7d6 to your computer and use it in GitHub Desktop.
Change text color based on background color
$(document).ready(function() {
var base = 'div'; // Change it to your element
$(base).each(function() {
var target = $(this);
var bgcolor = target.css('background-color');
var rgb = bgcolor.replace('rgb(', '').replace(')', '').split(',');
var c = 'rgb(' + rgb[0] + ',' + rgb[1] + ',' + rgb[2] + ')';
var o = Math.round(((parseInt(rgb[0]) * 299) + (parseInt(rgb[1]) * 587) + (parseInt(rgb[2]) * 114)) / 1000);
if (o > 125) {
$(target).css('color', 'black');
} else {
$(target).css('color', 'white');
}
$(target).css('background-color', c);
var r = Math.round(Math.random() * 255);
var g = Math.round(Math.random() * 255);
var b = Math.round(Math.random() * 255);
rgb[0] = r;
rgb[1] = g;
rgb[2] = b;
});
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment