Random color for jquery animation

Question

I am trying to add a text effect using jquery using ui animate . Is there a way to show all possible colors randomly without specific colors. For example, the color combination is based on RGB . Using color animations like

 setInterval(function() { jQuery(".font-style").animate({color: "red"}, 2000). animate({color: "green"}, 2000).animate({color: "blue"}, 2000);}, 400); 

Are there any possibilities to display the RGB color combination Randomly in jquery. Any suggestion would be great.

Thanks.

Answer 1

You can create a random color as follows:

 var newColor = '#'+(0x1000000+(Math.random())*0xffffff).toString(16).substr(1,6); jQuery(".font-style").animate({color: newColor}, 2000); // animate 

This will create a random hex color such as # ff00cc.

Note: regular jQuery does not animate colors; you will need to use the jQuery color plugin or jQuery UI

Answer 2

You can do something like this:

 var col = 'rgb(' + (Math.floor(Math.random() * 256)) + ',' + (Math.floor(Math.random() * 256)) + ',' + (Math.floor(Math.random() * 256)) + ')'; 

And than put col in the animation:

 jQuery(".font-style").animate({color: col}, 2000) 

Answer 3

 var hue = 'rgb(' + (Math.floor(Math.random() * 256)) + ',' + (Math.floor(Math.random() * 256)) + ',' + (Math.floor(Math.random() * 256)) + ')'; 

Then add this hue to your color

 jQuery(".font-style").animate({color: hue}, 2000). animate({color: hue}, 2000).animate({color: hue}, 2000);}, 400); 

JSFIDDLE DEMO for RANDOM color for tag

Answer 4

You can use Math.random

 setInterval(function() { var red= Math.floor((Math.random()*255)+1); var blue = Math.floor((Math.random()*255)+1); var green = Math.floor((Math.random()*255)+1); jQuery(".font-style").animate({color: "red"}, red). animate({color: "green"}, green).animate({color: "blue"}, blue);}, 400); 

if you do it continuously, although it is likely to quickly become immune .

Answer 5

 function get_random_color() { var letters = '0123456789ABCDEF'.split(''); var color = '#'; for (var i = 0; i < 6; i++ ) { color += letters[Math.round(Math.random() * 15)]; } return color; } 

The shortest code

Demo

 "#"+((1<<24)*Math.random()|0).toString(16); 

Answer 6

You can use the random javascripts method, set the boundaries and produce it either hexadecimal or rgb codes. Assign them to variables and use them instead of “red”, “green”, “blue”, etc.