barnade95 barnade95 - 1 month ago 24
CSS Question

Random color in jQuery

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

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/