Skip to content

How to make the “rainbow” code

It’s simple – anything you want rainbow-ed gets a span with a class of “rainbow”. For example:

<span class="rainbow">This is rainbow text.</span>

Ok, that’s not because it’s an example. But this is:

This is rainbow text.

I originally wrote the script when I was writing the Color 64 jQuery version. I repurposed it here for fun. Anyway, if you wish to use it, here it is, Choose your own colors, as many as you like, or customize the colors. I have provided the colors sampled from VICE 64.

jQuery(document).ready(function($) {
	
	window['activeColor'] = Math.floor(Math.random()*8);
	
	colors = new Array(
	// Commodore colors (from VICE 64)
// '#FFFFFF', // white
// '#BC6B4F', // red
// '#A8F3FF', // cyan
// '#C167FE', // purple
// '#95E747', // green
// '#6C48F8', // blue
// '#FEFF73', // yellow
// '#C69429', // orange
// '#8D7B00', // brown
// '#F6AC95', // lt. red
// '#818181', // d. gry
// '#B6B6B6', // m. gry
// '#D9FF9A', // lt. grn
// '#B29AFF', // l. blue
// '#E0E0E0', // l. gry
		'#C167FE',	// purple
		'#BC6B4F',	// red
		'#C69429',	// orange
		'#FEFF73',	// yellow
		'#FFFFFF',	// white
		'#A8F3FF',	// cyan
		'#B29AFF',	// lt. blue
		'#6C48F8'	// blue
	);
	
	$('.fl-logo-text').html( _c($('.fl-logo-text').html(), 'rainbow', 'html'));
	
	$('.rainbow').each(function(){
		$(this).html( _c($(this).html(), 'rainbow', 'html'));
	});
	
	function _c(string, type, ret)
	{
		if(ret == '')
		{
			ret = 'hex';
		}
		switch(type)
		{
			case 'rainbow':
				out = '';
				for(i=0;i<string.length;i++)
				{
					if(window['activeColor'] + 1 >= colors.length)
					{
						window['activeColor'] = 0;
					} else {
						window['activeColor']++;
					}

					if(ret == 'html')
					{
						out+='<span style="color:' + colors[window['activeColor']] + ';">' + string.substring(i,i+1) + '</span>';
					} else {
						out+='[[b;' + colors[window['activeColor']] + ';#000]' + string.substring(i,i+1) + ']';
					}
				}
				return out;
			break;
		}
	}
});

 

Leave a Comment