multiple - modify css property jquery
jquery valor de color css devuelve RGB? (3)
Algunos ajustes para funcionar
$.fn.getHexBackgroundColor = function() {
var rgb = $(this).css(''background-color'');
if (!rgb) {
return ''#FFFFFF''; //default color
}
var hex_rgb = rgb.match(/^rgb/((/d+),/s*(/d+),/s*(/d+)/)$/);
function hex(x) {return ("0" + parseInt(x).toString(16)).slice(-2);}
if (hex_rgb) {
return "#" + hex(hex_rgb[1]) + hex(hex_rgb[2]) + hex(hex_rgb[3]);
} else {
return rgb; //ie8 returns background-color in hex format then it will make compatible, you can improve it checking if format is in hexadecimal
}
}
En mi archivo CSS:
a, a:link, a:visited { color:#4188FB; }
a:active, a:focus, a:hover { color:#FFCC00; }
Lo intenté con:
var link_col = $("a:link").css("color");
alert(link_col); // returns rgb(65, 136, 251)
¿Cómo puedo obtener el código HEX?
*** edición: encontré la respuesta aquí:
Variable de color de fondo de hexadecimal a JavaScript
Qué vergüenza, podría haber buscado un poco mejor antes de publicar ...
Aquí está mi toma. Sencillo y conciso.
(function($) {
$.fn.getHexBackgroundColor = function() {
return (function(rgb) {
return ''#'' + (!rgb
? ''FFFFFF''
: rgb.match(/^rgb/((/d+),/s*(/d+),/s*(/d+)/)$/)
.slice(1)
.map(x => (''0'' + parseInt(x).toString(16)).slice(-2))
.join('''')
.toUpperCase());
})($(this).css(''background-color''));
}
})(jQuery);
$(function() {
$(''#color-rgb'').text($(''.foo'').css(''background-color''));
$(''#color-hex'').text($(''.foo'').getHexBackgroundColor());
});
.foo {
background: #F74;
width: 100px;
height: 100px;
}
label { font-weight: bold; }
label:after { content: '': ''; }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="foo"></div>
<label>RGB</label><span id="color-rgb">UNDEF</span><br />
<label>HEX</label><span id="color-hex">UNDEF</span>
Aquí tienes, esto te permitirá usar $ (selector) .getHexBackgroundColor () para devolver el valor hexadecimal fácilmente:
$.fn.getHexBackgroundColor = function() {
var rgb = $(this).css(''background-color'');
rgb = rgb.match(/^rgb/((/d+),/s*(/d+),/s*(/d+)/)$/);
function hex(x) {return ("0" + parseInt(x).toString(16)).slice(-2);}
return "#" + hex(rgb[1]) + hex(rgb[2]) + hex(rgb[3]);
}