javascript - 使用 JavaScript 函数更改 CSS 中的背景颜色

Question

使用 CSS，我试图将每个元素的背景颜色设置为悬停时的随机颜色：

:hover {
    background-color: "getRandom()";
}

但是，似乎无法在此处调用 JavaScript 函数。有没有其他可行的方法？

这是我正在处理的页面：http: //jsfiddle.net/FwKqq/3/

Answer 1

在您的 jQuery 代码中：

$("*").hover(
    function(event) {
        $(this).css("background-color", getRandomColor());
    },
    function (event) {
        $(this).css("background-color", "white");
    }
);

（您还应该删除:hovercss 元素）

示例：http: //jsfiddle.net/jqSgq/

Answer 2

尝试这个

$(function() {
    $('*').hover(
        function() { $(this).css('background-color', getRandom()); }, 
        function() {$(this).css('background-color', '#FFF');}
    );
});

Answer 3

function changeBackground(color) {
   document.body.style.background = //here apply background colour;
}

hover在事件中调用此函数

Answer 4

这是一个工作示例：http: //jsfiddle.net/FwKqq/4/

您需要在呼叫开始和结束时设置背景颜色，如下所示：

$("*").hover(
    function(event) {
        $(this).css('background-color', getRandomColor());
    },
    function (event) {
       $(this).css('background-color', 'white');
    }
 );

Answer 5

带有工作示例的纯跨浏览器 Javascript ：

var bgColor;
var els = document.getElementsByTagName('*');
for (var i = 0; i < els.length; i++) {
    if (document.addEventListener) {
        els[i].addEventListener('mouseover', function (e) {
            e.stopPropagation();
            bgColor = '#' + Math.floor(Math.random() * 16777215).toString(16);
            this.style.backgroundColor = bgColor;
        }, false);
        els[i].addEventListener('mouseout', function (e) {
            e.stopPropagation();
            bgColor = '#FFFFFF';
            this.style.backgroundColor = bgColor;
        }, false);
    } else {
        els[i].attachEvent('mouseover', function () {
            e.stopPropagation();
            bgColor = '#' + Math.floor(Math.random() * 16777215).toString(16);
            this.style.backgroundColor = bgColor;
        });
        els[i].attachEvent('mouseout', function () {
            e.stopPropagation();
            bgColor = '#FFFFFF';
            this.style.backgroundColor = bgColor;
        });
    }
}

来自这里的随机背景代码：http: //paulirish.com/2009/random-hex-color-code-snippets/