虹膜颜色选择器答案

【问题标题】：Iris Color Picker虹膜颜色选择器
【发布时间】：2013-09-14 19:49:48
【问题描述】：

目标是改变链接的颜色，但改变悬停状态的颜色。

这将完美运行：
jQuery("body").css("background-color", ui.color.toString());

但是如果你想改变悬停的颜色，它不会起作用：
jQuery("a:hover").css("color", ui.color.toString()) ;

完整的脚本是：

$('#wide-load').iris({ 宽度：170，隐藏：假，调色板：['#125', '#459', '#78b', '#ab0', '#de3', '#f0f'], 更改：函数（事件，用户界面）{ jQuery("body").css("背景颜色", ui.color.toString()); jQuery("a:hover").css("color", ui.color.toString()); } });

在线脚本： http://automattic.github.io/Iris/

【问题讨论】：

标签： jquery css colors picker

【解决方案1】：

我知道你提出这个要求已经几个月了，但我一直在为同样的事情苦苦挣扎，终于找到了解决方案。

对我有用的是使用 jQuery 将一个空的 <div> 附加到您的 body 中，然后每次更改颜色时在其中打印一个 <style> 标记，如下所示：

function changeHoverColor(){
    /* 
    check if your '#custom-css' div exists on page
    if not then create it and append it to the body
    */
    if( $('#custom-css').length < 1 ){
        var $cssDiv = $('<div id="custom-css">');
        $cssDiv.appendTo('body');
    }

    var myColor = '#ff7700'; //change this to your color

    /* change the below css to fit your needs */
    var myStyle = '<style>a:hover{color:'+myColor+';}</style>';

    /* 
    finally print it inside your div.
    Now, every time you pick a color, your new css will be generated and will
    overwrite the previous one inside the '#custom-css' div
    */
    $('#custom-css').html(myStyle);
}

希望对您有所帮助。干杯

【讨论】：