javascript - Random color in jQuery

Question

So i've put a header that minimizes when i scroll down, and grow back when scroll up. When the header collapses, it turns light gray, and when opens, changes it's color back. Here's the code i found:

$(window).scroll(function () {
 if ($(document).scrollTop() == 0) {
 $('#header_nav').removeClass('tiny');
 } else {
 $('#header_nav').addClass('tiny');
 }
});

I want the header to change it's color randomly when i refresh the page, but i would like to use exact colors. I found out how to change the background color, i could, for the 'tiny' header, but i'm too dumb to jQuery yet, so i couldn't write the color randomizer and then insert it to the code above.

Would you help me? Thank you for your help in advance :)

Answer 1

Hi you can use a function like this on Jquery:

$(document).ready(function () {
  var back = ["#ff0000","blue","gray"];
  var rand = back[Math.floor(Math.random() * back.length)];
  $('div').css('background',rand);
})

There on the var back you can write all exact colors you want. Then instead of $('div') you can set the selector for your header.

Check this demo http://jsfiddle.net/sJTHc/5/