使用颜色选择器更改网站背景颜色

问题描述：

我正在使用this colour picker作为我的网站。我需要做的是改变我的网站body/html当选择正在进行的背景。就像它改变了文本框的背景。使用颜色选择器更改网站背景颜色

我看过JS文件本身，但发现它有点复杂。我在第410 - 430行之间添加了document.body.style.background = styleElement.jscStyle.backgroundColor;，但没有任何变化。

我该如何实现它。

感谢

我会使用'document.body.style.backgroundColor'来确定。 – 2013-03-21 09:17:56

没有工作。我认为我在错误的地方添加了代码，但目前还没有运气。 – BentCoder 2013-03-21 09:19:59

我不会更改您使用的库的源代码。改用事件处理程序。 'document.getElementById（'colorpicker'）。addEventListener（'change'，changeColor）;''或'document.getElementById（'colorpicker'）。onChange = changeColor;' – 2013-03-21 09:20:24

答

在演示页面的section 8你有 “OnChange事件”：

您需要创建input这样的：

<input class="color" 
    onchange="document.body.style.backgroundColor = '#'+this.color">

我的猜测是，在您的示例中，您忘记了在颜色HEX代码之前添加#。

问题是我在我的CSS样式的HTML标记。现在删除它并且工作正常。谢谢 – BentCoder 2013-03-21 09:45:06

答

类（.colorPicker）添加到颜色选择器输入字段，然后为此在jQuery的：

'use strict'; 
$(document).ready(function(){ 
    $(".colorPicker").change(function(){ 
     $('body').css('background-color', $(this).css('background-color')); 
    }); 
});

使用颜色选择器更改网站背景颜色

相关推荐