随机化标志颜色并相应地更改CSS链接颜色

Question

该函数随机化网站的徽标。我试图做一个条件语句，相应地改变a：hover颜色。

如果选择蓝色，a:hover, .current-menu-item应该有color: blue;。

实现此目的的最佳方式是什么？

function logoChange() { 
var description = new Array(); 
description[0] = "images/logos/blue.png"; 
description[1] = "images/logos/green.png"; 
description[2] = "images/logos/orange.png"; 
description[3] = "images/logos/purple.png"; 
description[4] = "images/logos/red.png"; 
description[5] = "images/logos/yellow.png"; 
var size = description.length 
var x = Math.floor(size*Math.random()) 
document.getElementById('logo').src=description[x];  
} 
window.onload=logoChange; 


if (logo blue is chosen) 
    { 
    <style>a:hover, .current-menu-item {color: blue;}</style> 
    } 

elseif (logo green is chosen) 
    { 
    <style>a:hover, .current-menu-item {color: green;}</style> 
    } 

and so on... 

Answer 1

我所做的是创建了一个所有可能的颜色数组。注意颜色的索引如何匹配描述的索引。所以如果变量x变成3，那么purple.png将是logo，而紫色将是css的紫色。

function logoChange() { 
var description = new Array(); 
description[0] = "images/logos/blue.png"; 
description[1] = "images/logos/green.png"; 
description[2] = "images/logos/orange.png"; 
description[3] = "images/logos/purple.png"; 
description[4] = "images/logos/red.png"; 
description[5] = "images/logos/yellow.png"; 
var size = description.length; 
var x = Math.floor(size*Math.random()); 
document.getElementById('logo').src=description[x]; 

var colors = ['blue', 'green', 'orange', 'purple', 'red', 'yellow']; 

var thecolor = colors[x]; 

$('.current-menu-item').css({color: thecolor}); 

$("a").hover(function() { 
    $(this).css({ 
     color: thecolor 
    }); 
}, function() { 
    $(this).css({ 
     color: 'blue' // change 'blue' to whatever the normal color is without hover 
    }); 
}); 

} 

logoChange();