JavaScript Scripts





Español Français 中文 Deutsch Portuguese Japanese nederlands
   
 
Free Java Script Codes
Javascript List All
Slide Show Slide Show
Ad Display Ad Display
Image Effect Image Effect
Animated Image Effects Animated Image Effects
Form Validation Form Validation
Color Picker Tool Color Picker Tool
Formatting Forms Formatting Forms
Select All Select All
Dynamic Form Select Dynamic Form select
Dynamic Color Dynamic Color
Calendar Script Calendar
Textbox Counter Textbox Counter
Alphanumeric Alphanumeric
Date Time Script Date & Time
Stop Watch Script Stop Watch script
Delete Repeated Values Delete Repeated Values
Pagination Pagination
Random Generator Random Generator
Animated Text Animated Text
Cursor Position Cursor Position
User Info Window / User Info
Security Security / Authenticate
Bookmark Bookmark
Mouse Effects Mouse Effects
Title Bar Title Bar
Status Bar Status Bar
Country List Country List
Free Games Free Games
Calculators Calculators
 




Rainbow Effect- Text Color Animation script


About
  This javascript is used to display the given text in rainbow color effect. It helps us to apply rainbow color effect to perform animation to any web pages.


Features
a) Used to display text in rainbow effect.
b) Simple and easy to use.

Preview

Enter Text


Code
Javascript Code
<!-- Script by hscripts.com -->
<!-- Copyright of HIOXINDIA -->
<!-- More scripts @www.hscripts.com -->

<script type="text/javascript">
 var timer;
function toSpans(span) {
  var str=span.firstChild.data;
  var n=str.length;
  span.removeChild(span.firstChild);
  for(var i=0; i<n; i++) {
    var theSpan=document.createElement("SPAN");
    theSpan.appendChild(document.createTextNode(str.charAt(i)));
    span.appendChild(theSpan);
  }
}

function RainbowSpan(span, hue, deg, brt, spd, hspd) {
    this.deg=(deg==null?360:Math.abs(deg));
    this.hue=(hue==null?0:Math.abs(hue)%360);
    this.hspd=(hspd==null?3:Math.abs(hspd)%360);
    this.length=span.firstChild.data.length;
    this.span=span;
    this.speed=(spd==null?50:Math.abs(spd));
    this.hInc=this.deg/this.length;
    this.brt=(brt==null?255:Math.abs(brt)%256);
    this.timer=null;
    toSpans(span);
    this.moveRainbow();
}
RainbowSpan.prototype.moveRainbow = function() {
  
  if(this.hue>359) this.hue-=360;
  var color;
  var b=this.brt;
  var n=this.length;
  var h=this.hue;
  for(var i=0; i<n; i++){
    if(h>359) h-=360;
    if(h<60){color=Math.floor(((h)/60)*b); red=b;grn=color;blu=0; }
    else if(h<120){ color=Math.floor(((h-60)/60)*b); red=b-color;grn=b;blu=0; }
    else if(h<180){ color=Math.floor(((h-120)/60)*b); red=0;grn=b;blu=color; }
    else if(h<240){ color=Math.floor(((h-180)/60)*b); red=0;grn=b-color;blu=b; }
    else if(h<300){ color=Math.floor(((h-240)/60)*b); red=color;grn=0;blu=b; }
    else{ color=Math.floor(((h-300)/60)*b); red=b;grn=0;blu=b-color; }
    h+=this.hInc;
    this.span.childNodes[i].style.color="rgb("+red+", "+grn+", "+blu+")";
 
  }
  this.hue+=this.hspd;
}
function ctck()
{
    var sds = document.getElementById("dum");
    if(sds == null){
        alert("You are using a free package.\n You are not allowed to remove the tag.\n");
    }
    var sdss = document.getElementById("dumdiv");
    if(sdss == null){
        alert("You are using a free package.\n You are not allowed to remove the tag.\n");
    }
}
document.onload="ctck()";
</script>

<!-- Script by hscripts.com -->

HTML Code
<!-- Script by hscripts.com -->
<form name='form1'>
<table align='center'><td>Enter Text</td><td><input type='text' size='50' name='rainbowtext' id='rainbowtext' style='border: thin solid #4682B4;'></td></tr>
<tr><td colspan='2' align='center'><input type='button' value='submit' 
onClick='rain()'><div style="font-size: 10px;color: #dadada;" id="dumdiv">
<a href="http://www.hscripts.com" id="dum" style="text-decoration:none;color: #dadada;">&copy;h</a></div>
</td></tr>
<tr><td align='center' colspan='2'>
<div id="r1" style='border: 1px solid white;'></div>
</td></tr></table>
</form>
<script type="text/javascript">
function rain() { 
    var text=document.getElementById("rainbowtext").value;
    document.getElementById("r1").innerHTML=text;
    var r1=document.getElementById("r1"); 
    var myRainbowSpan=new RainbowSpan(r1, 0, 316, 215, 30, 15); 
}   
</script>
<!-- Script by hscripts.com -->

Release Date - 11-02-2010
Get free version without ©copyright link for just 5 price

For customization of this script or any script development, contact us at support@hscripts.com


Usage
 a) Copy and paste the javascript code into your HTML page and make use of this animation.
 b) This script is used to display the given text in rainbow effect.



License
- The javascript (misspelled as java script) is given under GPL License
- i.e. Free use for those who use the codes as it is.
- Free, if your modification does not remove our copyright information and links.
- Click Here for detailed license information.
- You can purchase the script if your requirements does not meet our GPL License terms.
Other Links

web hosting