开发者

jQuery - color cycle animation with hsv colorspace?

I am working on a project, which I need a special body-background for. The background-color should cycle through the color spectrum like a mood light. So I found this:

http://buildinternet.com/2009/09/its-a-rainbow-color-changing-text-and-backgrounds/

"But" this snippet is working with the RGB colorspace which has some very light and dark colors in it. Getting just bright colors will only work with the HSV colorspace (e.g. having S and V static at 100 and letting H cycle). I don’t know how to convert and in fact how to pimp this snippet for my needs.

Does anyone h开发者_StackOverflowas an idea??

Thanks in advance. Best, Floyd


Just use an ready made RGB to HSV conversion function, like this for example:

http://mjijackson.com/2008/02/rgb-to-hsl-and-rgb-to-hsv-color-model-conversion-algorithms-in-javascript

Then just input your color as HSV and you'll get RGB that you can use in your animations.


ColorJizz should be what you need.


I believe that this is the effect you were looking for. The randRange() function allows you to specify a minimum and maximum value.

<script language="JavaScript" type="text/javascript">
function randRange(lowVal,highVal) {
     return Math.floor(Math.random()*(highVal-lowVal+1))+lowVal;
}
function spectrum(){  
    var hue = 'rgb(' + randRange(100,256) + ',' + randRange(100,256) + ',' + randRange(100,256) + ')';  
    $('#div').animate( { backgroundColor: hue }, 1000);  
    spectrum();  
 }  
$(function(){
    spectrum();
});
</script>
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜