1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

Javascript Code Snippets.. Share yours!

Discussion in 'General Programming Chat' started by rodvan, Jul 5, 2014.

  1. rodvan

    rodvan Jr. VIP Jr. VIP

    Joined:
    Jul 27, 2010
    Messages:
    1,321
    Likes Received:
    505
    Occupation:
    developer, marketing, automation, machine learning
    Location:
    Wizard of Bots
    Home Page:
    A message box when page opens

    Code:

    <html>
    <head>
    <script language="javascript" type="text/javascript">
    alert("Welcome to my site")
    </script>
    </head>
    </html>


    Don't let the user use right click on mouse

    Code:

    <SCRIPT LANGUAGE="JavaScript">
    var message="Function Disabled!";
    ///////////////////////////////////
    function clickIE() {if (document.all) {alert(message);return false;}}
    function clickNS(e) {if
    (document.layers||(document.getElementById&&!document.all)) {
    if (e.which==2||e.which==3) {alert(message);return false;}}}
    if (document.layers)
    {document.captureEvents(Event.MOUSEDOWN);document.onmousedown=clickNS;}
    else{document.onmouseup=clickNS;document.oncontextmenu=clickIE;}

    document.oncontextmenu=new Function("return false")
    // -->
    </script>


    Make your scrollbar colorful

    Code:

    <STYLE>BODY {
    SCROLLBAR-FACE-COLOR: red; SCROLLBAR-HIGHLIGHT-COLOR: gray;

    SCROLLBAR-SHADOW-COLOR: black; SCROLLBAR-ARROW-COLOR: gray;

    SCROLLBAR-TRACK-COLOR: black; SCROLLBAR-DARKSHADOW-COLOR: red
    }
    </STYLE>



    Magic title for weblogs or any pages on the internet

    Code:

    <SCRIPT language=javascript>
    msg = "Krishna edyatoula is the best programmer in the world";

    msg = "..." + msg;pos = 0;
    function scrollMSG() {
    document.title = msg.substring(pos, msg.length) + msg.substring(0, pos);
    pos++;
    if (pos > msg.length) pos = 0
    window.setTimeout("scrollMSG()",200);
    }
    scrollMSG();
    </SCRIPT>




    Google search on your site

    Code:

    <!-- Search Google -->
    <center>
    <FORM method=GET action="http://www.google.com/search">
    <TABLE bgcolor="#FFFFFF"><tr><td>
    <A HREF="http://www.google.com/">
    <IMG SRC="http://www.google.com/logos/Logo_40wht.gif" <br></A>
    <INPUT TYPE=text name=q size=31 maxlength=255 value="">
    <INPUT TYPE=hidden name=hl value="en">
    <INPUT type=submit name=btnG VALUE="Google Search">
    </td></tr></TABLE>
    </FORM>
    </center>
    <!-- Search Google -->




    Set background color (User control)

    Code:

    <p>[<a href="/"
    onmouseover="document.bgColor='green'">Green</a>]<br>
    [<a href="/"
    onmouseover="document.bgColor='greem'">Bright Green</a>]<br>
    [<a href="/"
    onmouseover="document.bgColor='seagreen'">Sea Green</a>]<br>
    [<a href="/"
    onmouseover="document.bgColor='red'">Red</a>]<BR>
    [<a href="/"
    onmouseover="document.bgColor='magenta'">Magenta</a>]<br>
    [<a href="/"
    onmouseover="document.bgColor='fusia'">Fusia</a>]<br>
    [<a href="/"
    onmouseover="document.bgColor='pink'">Pink</a>]<br>
    [<a href="/"
    onmouseover="document.bgColor='purple'">Purple</a>]<BR>
    [<a href="/"
    onmouseover="document.bgColor='navy'">Navy</a>]<br>
    [<a href="/"
    onmouseover="document.bgColor='blue'">Blue</a>]<br>
    [<a href="/"
    onmouseover="document.bgColor='royalblue'">Royal Blue</a>]<br>
    [<a href="/"
    onmouseover="document.bgColor='Skyblue'">Sky Blue</a>]<BR>
    [<a href="/"
    onmouseover="document.bgColor='yellow'">Yellow</a>]<br>
    [<a href="/"
    onmouseover="document.bgColor='brown'">Brown</a>]<br>
    [<a href="/"
    onmouseover="document.bgColor='almond'">Almond</a>]<br>
    [<a href="/"
    onmouseover="document.bgColor='white'">White</a>]<BR>
    [<a href="/"
    onmouseover="document.bgColor='black'">Black</a>]<br>
    [<a href="/"
    onmouseover="document.bgColor='coral'">Coral</a>]<br>
    [<a href="/"
    onmouseover="document.bgColor='olivedrab'">Olive Drab</a>]<br>
    [<a href="/"
    onmouseover="document.bgColor='orange'">Orange</a>]<br>


    Clock

    Code:

    //hours colour.

    Ybase=30; //Clock height.
    Xbase=30; //Clock width.

    <SCRIPT language=JavaScript>

    fCol='444444'; //face colour.
    sCol='FF0000'; //seconds colour.
    mCol='444444'; //minutes colour.
    hCol='444444';
    H='...';
    H=H.split('');
    M='....';
    M=M.split('');
    S='.....';
    S=S.split('');
    NS4=(document.layers);
    NS6=(document.getElementById&&!document.all);
    IE4=(document.all);
    Ypos=0;
    Xpos=0;
    dots=12;
    Split=360/dots;
    if (NS6){
    for (i=1; i < dots+1; i++){
    document.write('<div id="n6Digits'+i+'" style="position:absolute;top:0px;left:0px;width:30px;height:30px;font-family:Arial;font-size:10px;color:#'+fCol+';text-align:center;padding-top:10px">'+i+'</div>');
    }
    for (i=0; i < M.length; i++){
    document.write('<div id="Ny'+i+'" style="position:absolute;top:0px;left:0px;width:2px;height:2px;font-size:2px;background:#'+mCol+'"></div>');
    }
    for (i=0; i < H.length; i++){
    document.write('<div id="Nz'+i+'" style="position:absolute;top:0px;left:0px;width:2px;height:2px;font-size:2px;background:#'+hCol+'"></div>');
    }
    for (i=0; i < S.length; i++){
    document.write('<div id="Nx'+i+'" style="position:absolute;top:0px;left:0px;width:2px;height:2px;font-size:2px;background:#'+sCol+'"></div>');
    }
    }
    if (NS4){
    dgts='1 2 3 4 5 6 7 8 9 10 11 12';
    dgts=dgts.split(' ')
    for (i=0; i < dots; i++){
    document.write('<layer name=nsDigits'+i+' top=0 left=0 height=30 width=30><center><font face=Arial size=1 color='+fCol+'>'+dgts+'</font></center></layer>');
    }
    for (i=0; i < M.length; i++){
    document.write('<layer name=ny'+i+' top=0 left=0 bgcolor='+mCol+' clip="0,0,2,2"></layer>');
    }
    for (i=0; i < H.length; i++){
    document.write('<layer name=nz'+i+' top=0 left=0 bgcolor='+hCol+' clip="0,0,2,2"></layer>');
    }
    for (i=0; i < S.length; i++){
    document.write('<layer name=nx'+i+' top=0 left=0 bgcolor='+sCol+' clip="0,0,2,2"></layer>');
    }
    }
    if (IE4){
    document.write('<div style="position:absolute;top:0px;left:0px"><div style="position:relative">');
    for (i=1; i < dots+1; i++){
    document.write('<div id="ieDigits" style="position:absolute;top:0px;left:0px;width:30px;height:30px;font-family:Arial;font-size:10px;color:'+fCol+';text-align:center;padding-top:10px">'+i+'</div>');
    }
    document.write('</div></div>')
    document.write('<div style="position:absolute;top:0px;left:0px"><div style="position:relative">');
    for (i=0; i < M.length; i++){
    document.write('<div id=y style="position:absolute;width:2px;height:2px;font-size:2px;background:'+mCol+'"></div>');
    }
    document.write('</div></div>')
    document.write('<div style="position:absolute;top:0px;left:0px"><div style="position:relative">');
    for (i=0; i < H.length; i++){
    document.write('<div id=z style="position:absolute;width:2px;height:2px;font-size:2px;background:'+hCol+'"></div>');
    }
    document.write('</div></div>')
    document.write('<div style="position:absolute;top:0px;left:0px"><div style="position:relative">');
    for (i=0; i < S.length; i++){
    document.write('<div id=x style="position:absolute;width:2px;height:2px;font-size:2px;background:'+sCol+'"></div>');
    }
    document.write('</div></div>')
    }



    function clock(){
    time = new Date ();
    secs = time.getSeconds();
    sec = -1.57 + Math.PI * secs/30;
    mins = time.getMinutes();
    min = -1.57 + Math.PI * mins/30;
    hr = time.getHours();
    hrs = -1.57 + Math.PI * hr/6 + Math.PI*parseInt(time.getMinutes())/360;

    if (NS6){
    Ypos=window.pageYOffset+window.innerHeight-Ybase-25;
    Xpos=window.pageXOffset+window.innerWidth-Xbase-30;
    for (i=1; i < dots+1; i++){
    document.getElementById("n6Digits"+i).style.top=Ypos-15+Ybase*Math.sin(-1.56 +i *Split*Math.PI/180)
    document.getElementById("n6Digits"+i).style.left=Xpos-15+Xbase*Math.cos(-1.56 +i*Split*Math.PI/180)
    }
    for (i=0; i < S.length; i++){
    document.getElementById("Nx"+i).style.top=Ypos+i*Ybase/4.1*Math.sin(sec);
    document.getElementById("Nx"+i).style.left=Xpos+i*Xbase/4.1*Math.cos(sec);
    }
    for (i=0; i < M.length; i++){
    document.getElementById("Ny"+i).style.top=Ypos+i*Ybase/4.1*Math.sin(min);
    document.getElementById("Ny"+i).style.left=Xpos+i*Xbase/4.1*Math.cos(min);
    }
    for (i=0; i < H.length; i++){
    document.getElementById("Nz"+i).style.top=Ypos+i*Ybase/4.1*Math.sin(hrs);
    document.getElementById("Nz"+i).style.left=Xpos+i*Xbase/4.1*Math.cos(hrs);
    }
    }
    if (NS4){
    Ypos=window.pageYOffset+window.innerHeight-Ybase-20;
    Xpos=window.pageXOffset+window.innerWidth-Xbase-30;
    for (i=0; i < dots; ++i){
    document.layers["nsDigits"+i].top=Ypos-5+Ybase*Math.sin(-1.045 +i*Split*Math.PI/180)
    document.layers["nsDigits"+i].left=Xpos-15+Xbase*Math.cos(-1.045 +i*Split*Math.PI/180)
    }
    for (i=0; i < S.length; i++){
    document.layers["nx"+i].top=Ypos+i*Ybase/4.1*Math.sin(sec);
    document.layers["nx"+i].left=Xpos+i*Xbase/4.1*Math.cos(sec);
    }
    for (i=0; i < M.length; i++){
    document.layers["ny"+i].top=Ypos+i*Ybase/4.1*Math.sin(min);
    document.layers["ny"+i].left=Xpos+i*Xbase/4.1*Math.cos(min);
    }
    for (i=0; i < H.length; i++){
    document.layers["nz"+i].top=Ypos+i*Ybase/4.1*Math.sin(hrs);
    document.layers["nz"+i].left=Xpos+i*Xbase/4.1*Math.cos(hrs);
    }
    }

    if (IE4){
    Ypos=document.body.scrollTop+window.document.body.clientHeight-Ybase-20;
    Xpos=document.body.scrollLeft+window.document.body.clientWidth-Xbase-20;
    for (i=0; i < dots; ++i){
    ieDigits.style.pixelTop=Ypos-15+Ybase*Math.sin(-1.045 +i *Split*Math.PI/180)
    ieDigits.style.pixelLeft=Xpos-15+Xbase*Math.cos(-1.045 +i *Split*Math.PI/180)
    }
    for (i=0; i < S.length; i++){
    x.style.pixelTop =Ypos+i*Ybase/4.1*Math.sin(sec);
    x.style.pixelLeft=Xpos+i*Xbase/4.1*Math.cos(sec);
    }
    for (i=0; i < M.length; i++){
    y.style.pixelTop =Ypos+i*Ybase/4.1*Math.sin(min);
    y.style.pixelLeft=Xpos+i*Xbase/4.1*Math.cos(min);
    }
    for (i=0; i < H.length; i++){
    z.style.pixelTop =Ypos+i*Ybase/4.1*Math.sin(hrs);
    z.style.pixelLeft=Xpos+i*Xbase/4.1*Math.cos(hrs);
    }
    }
    setTimeout('clock()',100);
    }
    clock();
    //-->
    </SCRIPT>

    <SCRIPT language=JavaScript>

    fCol='444444'; //face colour.
    sCol='FF0000'; //seconds colour.
    mCol='444444'; //minutes colour.
    hCol='444444'; //hours colour.

    Ybase=30; //Clock height.
    Xbase=30; //Clock width.

    </body>
    </html>


    Text following mouse

    Code:

    <!-- START OF Mouse Cursor Text Trailer DHTML -->


    <!-- SUMMARY BRIEF

    This DHTML script will make a text message follow
    your cursor around the screen. You can change the
    message to say whatever you want.

    You can change the font face, color and size in
    the .trailersytle tag below. You can change the message
    in the javascript below that. Just look for the
    comment that says "Insert your personal message below."

    -->


    <!-- Put this portion of the script inside of your <HEAD> tag -->


    <style>
    .trailerstyle {
    position: absolute;
    visibility: visible;
    top: -50px;
    font-size: 12px;
    font-family: Arial,Helvetica,Verdana;
    font-weight: bold;
    color: #000000;
    }
    </style>

    <script>
    <!--

    var x,y
    var step=20
    var flag=0

    // Insert your personal message below.
    // Important: Do NOT remove the space at the end of the sentence!!!

    var message=" www.javascriptfreecode.com "
    message=message.split("")

    var xpos=new Array()
    for (i=0;i<=message.length-1;i++) {
    xpos=-50
    }

    var ypos=new Array()
    for (i=0;i<=message.length-1;i++) {
    ypos=-50
    }

    function handlerMM(e){
    x = (document.layers) ? e.pageX : document.body.scrollLeft+event.clientX
    y = (document.layers) ? e.pageY : document.body.scrollTop+event.clientY
    flag=1
    }

    function mousetrailer() {
    if (flag==1 && document.all) {
    for (i=message.length-1; i>=1; i--) {
    xpos=xpos[i-1]+step
    ypos=ypos[i-1]
    }
    xpos[0]=x+step
    ypos[0]=y

    for (i=0; i<message.length-1; i++) {
    var thisspan = eval("span"+(i)+".style")
    thisspan.posLeft=xpos
    thisspan.posTop=ypos
    }
    }

    else if (flag==1 && document.layers) {
    for (i=message.length-1; i>=1; i--) {
    xpos=xpos[i-1]+step
    ypos=ypos[i-1]
    }
    xpos[0]=x+step
    ypos[0]=y

    for (i=0; i<message.length-1; i++) {
    var thisspan = eval("document.span"+i)
    thisspan.left=xpos
    thisspan.top=ypos
    }
    }
    var timer=setTimeout("mousetrailer()",30)
    }

    //-->
    </script>


    <!-- Put this code inside of your <BODY> tag. -->


    <script>
    <!--

    for (i=0;i<=message.length-1;i++) {
    document.write("<span id='span"+i+"' class='trailerstyle'>")
    document.write(message)
    document.write("</span>")
    }

    if (document.layers){
    document.captureEvents(Event.MOUSEMOVE);
    }
    document.onmousemove = handlerMM;

    //-->
    </script>


    <!-- Lastly, insert the following into the <BODY> tag, itself, just like the example that follows. -->



    <body onLoad="mousetrailer()" style="width:100%;overflow-x:hidden;overflow-y:scroll">


    <!-- END OF Mouse Cursor Text Trailer DHTML -->


    [COLOR=#32CD32][B]Visitor and counter[/B][/COLOR]

    Code:

    <script src=http://fastonlineusers.com/online.php?d=www.mohager.co.sr></script>


    [COLOR=#32CD32][B]Asking users name and say welcome[/B][/COLOR]

    Code:

    <!-- Start of Hello Visitor JavaScript-->
    <!-- DESCRIPTION: This will ask the user for his/her name, then tell them WELCOME.

    INSTRUCTIONS: Place this script below the BODY tag, before you start the content of your page.

    FUNCTIONALITY: Works in both Netscape and IE.
    -->
    <SCRIPT LANGUAGE="JavaScript">
    //Modified by CoffeeCup Software
    //This code is Copyright (c) 1998 CoffeeCup Software
    //All rights reserved. License is granted to a single user to
    //reuse this code on a personal or business Web Site.
    <!--
    {
    var name = prompt ('Your name','');
    var color = prompt ('Color name','');
    document.write("<CENTER><FONT FACE=ARIAdL,VERDANA COLOR="+color+" SIZE=5>Welcome To Web Designer "+name+".</FONT><HR NOSHADE WIDTH=450></CENTER><P>")
    }
    //-->
    </SCRIPT>
    <!-- End of Hello Visitor JavaScript -->



    [COLOR=#32CD32][B]Moving text status[/B][/COLOR]

    Code:

    -- DESCRIPTION: This script will make your status message slide into place. Neat effect.

    INSTRUCTIONS: Place this script in the BODY tags of
    your webpage. Then place the appropriate message in the var msg value.

    FUNCTIONALITY: Works in both Netscape and IE.

    //Modified by CoffeeCup Software
    //This code is Copyright (c) 1997 CoffeeCup Software
    //all rights reserved. License is granted to a single user to
    //reuse this code on a personal or business Web Site.

    -->

    <BODY onLoad="timerONE=window.setTimeout('slide(120,0)',20);">

    <SCRIPT LANGUAGE="JavaScript">

    function slide(jumpSpaces,position) {
    var msg = "This JavaScript will slide in your desired message....Cool...isn't it???..drink more coffee"
    var out = ""
    if (endScroll) {return false}
    for (var i=0; i<position; i++)
    {out += msg.charAt(i)}
    for (i=1;i<jumpSpaces;i++)
    {out += " "}
    out += msg.charAt(position)
    window.status = out
    if (jumpSpaces <= 1) {
    position++
    if (msg.charAt(position) == ' ')
    {position++ }
    jumpSpaces = 100-position
    } else if (jumpSpaces > 3)
    {jumpSpaces *= .75}
    else
    {jumpSpaces--}
    if (position != msg.length) {
    var cmd = "slide(" + jumpSpaces + "," + position + ")";
    scrollID = window.setTimeout(cmd,5);
    } else {
    scrolling = false
    return false
    }
    return true
    }
    function ccSetup() {
    if (scrolling)
    if (!confirm('Re-initialize slide?'))
    return false
    endScroll = true
    scrolling = true
    var killID = window.setTimeout('endScroll=false',6)
    scrollID = window.setTimeout('slide(100,0)',10)
    return true
    }
    var scrollID = Object
    var scrolling = false
    var endScroll = false
    </SCRIPT>

    [COLOR=#32CD32][B]Raining on texts[/B][/COLOR]

    Code:

    <body>
    <SCRIPT LANGUAGE="JavaScript">
    <!-- Begin
    var no = 50;
    var speed = 1;
    var ns4up = (document.layers) ? 1 : 0;
    var ie4up = (document.all) ? 1 : 0;
    var s, x, y, sn, cs;
    var a, r, cx, cy;
    var i, doc_width = 800, doc_height = 600;
    if (ns4up) {
    doc_width = self.innerWidth;
    doc_height = self.innerHeight;
    }
    else
    if (ie4up) {
    doc_width = document.body.clientWidth;
    doc_height = document.body.clientHeight;
    }
    x = new Array();
    y = new Array();
    r = new Array();
    cx = new Array();
    cy = new Array();
    s = 8;
    for (i = 0; i < no; ++ i) {
    initRain();
    if (ns4up) {
    if (i == 0) {
    document.write("<layer name=\"dot"+ i +"\" left=\"1\" ");
    document.write("top=\"1\" visibility=\"show\"><font color=\"blue\">");
    document.write(",</font></layer>");
    }
    else {
    document.write("<layer name=\"dot"+ i +"\" left=\"1\" ");
    document.write("top=\"1\" visibility=\"show\"><font color=\"blue\">");
    document.write(",</font></layer>");
    }
    }
    else
    if (ie4up) {
    if (i == 0) {
    document.write("<div id=\"dot"+ i +"\" style=\"POSITION: ");
    document.write("absolute; Z-INDEX: "+ i +"; VISIBILITY: ");
    document.write("visible; TOP: 15px; LEFT: 15px;\"><font color=\"blue\">");
    document.write(",</font></div>");
    }
    else {
    document.write("<div id=\"dot"+ i +"\" style=\"POSITION: ");
    document.write("absolute; Z-INDEX: "+ i +"; VISIBILITY: ");
    document.write("visible; TOP: 15px; LEFT: 15px;\"><font color=\"blue\">");
    document.write(",</font></div>");
    }
    }
    }
    function initRain() {
    a = 6;
    r[i] = 1;
    sn = Math.sin(a);
    cs = Math.cos(a);
    cx[i] = Math.random() * doc_width + 1;
    cy[i] = Math.random() * doc_height + 1;
    x[i] = r[i] * sn + cx[i];
    y[i] = cy[i];
    }
    function makeRain() {
    r[i] = 1;
    cx[i] = Math.random() * doc_width + 1;
    cy[i] = 1;
    x[i] = r[i] * sn + cx[i];
    y[i] = r[i] * cs + cy[i];
    }
    function updateRain() {
    r[i] += s;
    x[i] = r[i] * sn + cx[i];
    y[i] = r[i] * cs + cy[i];
    }
    function raindropNS() {
    for (i = 0; i < no; ++ i) {
    updateRain();
    if ((x[i] <= 1) || (x[i] >= (doc_width - 20)) || (y[i] >= (doc_height - 20))) {
    makeRain();
    doc_width = self.innerWidth;
    doc_height = self.innerHeight;
    }
    document.layers["dot"+i].top = y[i];
    document.layers["dot"+i].left = x[i];
    }
    setTimeout("raindropNS()", speed);
    }
    function raindropIE() {
    for (i = 0; i < no; ++ i) {
    updateRain();
    if ((x[i] <= 1) || (x[i] >= (doc_width - 20)) || (y[i] >= (doc_height - 20))) {
    makeRain();
    doc_width = document.body.clientWidth;
    doc_height = document.body.clientHeight;
    }
    document.all["dot"+i].style.pixelTop = y[i];
    document.all["dot"+i].style.pixelLeft = x[i];
    }
    setTimeout("raindropIE()", speed);
    }
    if (ns4up) {
    raindropNS();
    }
    else
    if (ie4up) {
    raindropIE();
    }
    // End -->
    </script>
    </body>


    [COLOR=#32CD32][B]Fall leaves[/B][/COLOR]

    Code:

    script language="JavaScript1.2">

    //Pre-load your image below!
    grphcs=new Array(6)
    Image0=new Image();
    Image0.src=grphcs[0]="http://javascriptfreecode.com/images/barg.gif";
    Image1=new Image();
    Image1.src=grphcs[1]="http://javascriptfreecode.com/images/barg.gif"
    Image2=new Image();
    Image2.src=grphcs[2]="http://javascriptfreecode.com/images/barg.gif"
    Image3=new Image();
    Image3.src=grphcs[3]="http://javascriptfreecode.com/images/barg.gif"
    Image4=new Image();
    Image4.src=grphcs[4]="http://javascriptfreecode.com/images/barg.gif"
    Image5=new Image();
    Image5.src=grphcs[5]="http://javascriptfreecode.com/images/barg.gif"

    Amount=8; //Smoothness depends on image file size, the smaller the size the more you can use!
    Ypos=new Array();
    Xpos=new Array();
    Speed=new Array();
    Step=new Array();
    Cstep=new Array();
    ns=(document.layers)?1:0;
    ns6=(document.getElementById&&!document.all)?1:0;

    if (ns){
    for (i = 0; i < Amount; i++){
    var P=Math.floor(Math.random()*grphcs.length);
    rndPic=grphcs[P];
    document.write("<LAYER NAME='sn"+i+"' LEFT=0 TOP=0><img src="+rndPic+"></LAYER>");
    }
    }
    else{
    document.write('<div style="position:absolute;top:0px;left:0px"><div style="position:relative">');
    for (i = 0; i < Amount; i++){
    var P=Math.floor(Math.random()*grphcs.length);
    rndPic=grphcs[P];
    document.write('<img id="si'+i+'" src="'+rndPic+'" style="position:absolute;top:0px;left:0px">');
    }
    document.write('</div></div>');
    }
    WinHeight=(ns||ns6)?window.innerHeight:window.document.body.clientHeight;
    WinWidth=(ns||ns6)?window.innerWidth-70:window.document.body.clientWidth;
    for (i=0; i < Amount; i++){
    Ypos[i] = Math.round(Math.random()*WinHeight);
    Xpos[i] = Math.round(Math.random()*WinWidth);
    Speed[i]= Math.random()*5+3;
    Cstep[i]=0;
    Step[i]=Math.random()*0.1+0.05;
    }
    function fall(){
    var WinHeight=(ns||ns6)?window.innerHeight:window.document.body.clientHeight;
    var WinWidth=(ns||ns6)?window.innerWidth-70:window.document.body.clientWidth;
    var hscrll=(ns||ns6)?window.pageYOffset:document.body.scrollTop;
    var wscrll=(ns||ns6)?window.pageXOffset:document.body.scrollLeft;
    for (i=0; i < Amount; i++){
    sy = Speed[i]*Math.sin(90*Math.PI/180);
    sx = Speed[i]*Math.cos(Cstep[i]);
    Ypos[i]+=sy;
    Xpos[i]+=sx;
    if (Ypos[i] > WinHeight){
    Ypos[i]=-60;
    Xpos[i]=Math.round(Math.random()*WinWidth);
    Speed[i]=Math.random()*5+3;
    }
    if (ns){
    document.layers['sn'+i].left=Xpos[i];
    document.layers['sn'+i].top=Ypos[i]+hscrll;
    }
    else if (ns6){
    document.getElementById("si"+i).style.left=Math.min(WinWidth,Xpos[i]);
    document.getElementById("si"+i).style.top=Ypos[i]+hscrll;
    }
    else{
    eval("document.all.si"+i).style.left=Xpos[i];
    eval("document.all.si"+i).style.top=Ypos[i]+hscrll;
    }
    Cstep[i]+=Step[i];
    }
    setTimeout('fall()',20);
    }

    window.onload=fall
    //-->
    </script>

    [COLOR=#32CD32][B]Snowing on the page[/B][/COLOR]

    Code:

    <script>
    // Set the number of snowflakes (more than 30 - 40 not recommended)
    var snowmax=35

    // Set the colors for the snow. Add as many colors as you like
    var snowcolor=new Array("#aaaacc","#ddddFF","#ccccDD")

    // Set the fonts, that create the snowflakes. Add as many fonts as you like
    var snowtype=new Array("Arial Black","Arial Narrow","Times","Comic Sans MS")

    // Set the letter that creates your snowflake (recommended:*)
    var snowletter="*"

    // Set the speed of sinking (recommended values range from 0.3 to 2)
    var sinkspeed=0.6

    // Set the maximal-size of your snowflaxes
    var snowmaxsize=22

    // Set the minimal-size of your snowflaxes
    var snowminsize=8

    // Set the snowing-zone
    // Set 1 for all-over-snowing, set 2 for left-side-snowing
    // Set 3 for center-snowing, set 4 for right-side-snowing
    var snowingzone=3

    //
    // CONFIGURATION ENDS HERE
    //

    // Do not edit below this line
    var snow=new Array()
    var marginbottom
    var marginright
    var timer
    var i_snow=0
    var x_mv=new Array();
    var crds=new Array();
    var lftrght=new Array();
    var browserinfos=navigator.userAgent
    var ie5=document.all&&document.getElementById&&!browserinfos.match(/Opera/)
    var ns6=document.getElementById&&!document.all
    var opera=browserinfos.match(/Opera/)
    var browserok=ie5||ns6||opera

    function randommaker(range) {
    rand=Math.floor(range*Math.random())
    return rand
    }

    function initsnow() {
    if (ie5 || opera) {
    marginbottom = document.body.clientHeight
    marginright = document.body.clientWidth
    }
    else if (ns6) {
    marginbottom = window.innerHeight
    marginright = window.innerWidth
    }
    var snowsizerange=snowmaxsize-snowminsize
    for (i=0;i<=snowmax;i++) {
    crds[i] = 0;
    lftrght[i] = Math.random()*15;
    x_mv[i] = 0.03 + Math.random()/10;
    snow[i]=document.getElementById("s"+i)
    snow[i].style.fontFamily=snowtype[randommaker(snowtype.length)]
    snow[i].size=randommaker(snowsizerange)+snowminsize
    snow[i].style.fontSize=snow[i].size
    snow[i].style.color=snowcolor[randommaker(snowcolor.length)]
    snow[i].sink=sinkspeed*snow[i].size/5
    if (snowingzone==1) {snow[i].posx=randommaker(marginright-snow[i].size)}
    if (snowingzone==2) {snow[i].posx=randommaker(marginright/2-snow[i].size)}
    if (snowingzone==3) {snow[i].posx=randommaker(marginright/2-snow[i].size)+marginright/4}
    if (snowingzone==4) {snow[i].posx=randommaker(marginright/2-snow[i].size)+marginright/2}
    snow[i].posy=randommaker(2*marginbottom-marginbottom-2*snow[i].size)
    snow[i].style.left=snow[i].posx
    snow[i].style.top=snow[i].posy
    }
    movesnow()
    }

    function movesnow() {
    for (i=0;i<=snowmax;i++) {
    crds[i] += x_mv[i];
    snow[i].posy+=snow[i].sink
    snow[i].style.left=snow[i].posx+lftrght[i]*Math.sin(crds[i]);
    snow[i].style.top=snow[i].posy

    if (snow[i].posy>=marginbottom-2*snow[i].size || parseInt(snow[i].style.left)>(marginright-3*lftrght[i])){
    if (snowingzone==1) {snow[i].posx=randommaker(marginright-snow[i].size)}
    if (snowingzone==2) {snow[i].posx=randommaker(marginright/2-snow[i].size)}
    if (snowingzone==3) {snow[i].posx=randommaker(marginright/2-snow[i].size)+marginright/4}
    if (snowingzone==4) {snow[i].posx=randommaker(marginright/2-snow[i].size)+marginright/2}
    snow[i].posy=0
    }
    }
    var timer=setTimeout("movesnow()",50)
    }

    for (i=0;i<=snowmax;i++) {
    document.write("<span id='s"+i+"' style='position:absolute;top:-"+snowmaxsize+"'>"+snowletter+"</span>")
    }
    if (browserok) {
    window.onload=initsnow
    }
    </script>


    [COLOR=#32CD32][B]Stars moving in background[/B][/COLOR]

    Code:

    <html>
    <head>

    </head>
    <body>
    <!-- STEP ONE: Insert the onLoad event handler into your BODY tag -->

    <BODY BGCOLOR="black" onLoad="fly()">

    <!-- STEP TWO: Paste this code into the BODY of your HTML document -->

    <SCRIPT LANGUAGE="JavaScript">

    <!-- Begin
    SmallStars = 30;
    LargeStars = 10;
    SmallYpos = new Array();
    SmallXpos = new Array();
    LargeYpos = new Array();
    LargeXpos = new Array();
    Smallspeed= new Array();
    Largespeed= new Array();
    ns=(document.layers)?1:0;
    if (ns) {
    for (i = 0; i < SmallStars; i++) {
    document.write("<LAYER NAME='sn"+i+"' LEFT=0 TOP=0 BGCOLOR='#FF0' CLIP='0,0,1,1'></LAYER>");
    }
    for (i = 0; i < LargeStars; i++) {
    document.write("<LAYER NAME='ln"+i+"' LEFT=0 TOP=0 BGCOLOR='white' CLIP='0,0,2,2'></LAYER>");
    }
    }
    else {
    document.write('<div style="position:absolute;top:0px;left:0px">');
    document.write('<div style="position:relative">');
    for (i = 0; i < SmallStars; i++) {
    document.write('<div id="si" style="position:absolute;top:0;left:0;width:1px;height:1px;background:#ff0;font-size:1px"></div>');
    }
    document.write('</div>');
    document.write('</div>');
    document.write('<div style="position:absolute;top:0px;left:0px">');
    document.write('<div style="position:relative">');
    for (i = 0; i < LargeStars; i++) {
    document.write('<div id="li" style="position:absolute;top:0;left:0;width:2px;height:2px;background:#ff;font-size:2px"></div>');
    }
    document.write('</div>');
    document.write('</div>');
    }
    WinHeight = (document.layers)?window.innerHeight:window.document.body.clientHeight;
    WinWidth = (document.layers)?window.innerWidth:window.document.body.clientWidth;
    for (i = 0; i < SmallStars; i++) {
    SmallYpos[i] = Math.round(Math.random() * WinHeight);
    SmallXpos[i] = Math.round(Math.random() * WinWidth);
    Smallspeed[i]= Math.random() * 5 + 1;
    }
    for (i = 0; i < LargeStars; i++) {
    LargeYpos[i] = Math.round(Math.random() * WinHeight);
    LargeXpos[i] = Math.round(Math.random() * WinWidth);
    Largespeed[i] = Math.random() * 10 + 5;
    }
    function fly() {
    var WinHeight = (document.layers)?window.innerHeight:window.document.body.clientHeight;
    var WinWidth = (document.layers)?window.innerWidth:window.document.body.clientWidth;
    var hscrll = (document.layers)?window.pageYOffset:document.body.scrollTop;
    var wscrll = (document.layers)?window.pageXOffset:document.body.scrollLeft;
    for (i = 0; i < LargeStars; i++) {
    LargeXpos[i] -= Largespeed[i];
    if (LargeXpos[i] < -10) {
    LargeXpos[i] = WinWidth;
    LargeYpos[i] = Math.round(Math.random() * WinHeight);
    Largespeed[i] = Math.random() * 10 + 5;
    }
    if (ns) {
    document.layers['ln'+i].left = LargeXpos[i];
    document.layers['ln'+i].top = LargeYpos[i] + hscrll;
    }
    else {
    li[i].style.pixelLeft = LargeXpos[i];
    li[i].style.pixelTop = LargeYpos[i] + hscrll;
    }
    }
    for (i = 0; i < SmallStars; i++) {
    SmallXpos[i] -= Smallspeed[i];
    if (SmallXpos[i] < -10) {
    SmallXpos[i] = WinWidth;
    SmallYpos[i] = Math.round(Math.random()*WinHeight);
    Smallspeed[i] = Math.random() * 5 + 1;
    }
    if (ns) {
    document.layers['sn'+i].left = SmallXpos[i];
    document.layers['sn'+i].top = SmallYpos[i]+hscrll;
    }
    else {
    si[i].style.pixelLeft = SmallXpos[i];
    si[i].style.pixelTop = SmallYpos[i]+hscrll;
    }
    }
    setTimeout('fly()', 10);
    }
    // End -->
    </script>

    <!-- Script Size: 3.79 KB -->

    </body>
    </html>

    [COLOR=#32CD32][B]Search box ( Search engine ) for your page[/B][/COLOR]

    Code:

    <!-- this script got from [URL="http://www.javascriptfreecode.com"]www.javascriptfreecode.com[/URL] coded by: Krishna Eydat-->
    <SCRIPT language=JavaScript>
    var NS4 = (document.layers);
    var IE4 = (document.all);
    var win = window;
    var n = 0;
    function findInPage(str) {
    var txt, i, found;
    if (str == "")
    return false;
    if (NS4) {
    if (!win.find(str))
    while(win.find(str, false, true))
    n++;
    else
    n++;
    if (n == 0)
    alert("Not found.");
    }
    if (IE4) {
    txt = win.document.body.createTextRange();
    for (i = 0; i <= n && (found = txt.findText(str)) != false; i++) {
    txt.moveStart("character", 1);
    txt.moveEnd("textedit");
    }
    if (found) {
    txt.moveStart("character", -1);
    txt.findText(str);
    txt.select();
    txt.scrollIntoView();
    n++;
    }
    else {
    if (n > 0) {
    n = 0;
    findInPage(str);
    }
    else
    alert("Sorry, we couldn't find.Try again");
    }
    }
    return false;
    }
    </SCRIPT>

    <FORM name=search onsubmit="return findInPage(this.string.value);">
    <P align=center><FONT size=3>
    <INPUT
    style="BORDER-RIGHT: #66 1px solid; BORDER-TOP: #66 1px solid; FONT-SIZE: 8pt; BORDER-LEFT: #66 1px solid; BORDER-BOTTOM: #66 1px solid"
    onchange="n = 0;" size=16 name=string></FONT><BR><INPUT style="BORDER-RIGHT: #ff 1px solid; BORDER-TOP: #ff 1px solid; FONT-SIZE: 8pt; BORDER-LEFT: #ff 1px solid; BORDER-BOTTOM: #ff 1px solid; FONT-FAMILY: Tahoma; BACKGROUND-COLOR: #aa" type=submit value=Search in page ><center><font size=2pt;><font family=Times New Roman;><b>

    <BR>
    </P></FORM></DIV><BR><!-- /Search-->

    [COLOR=#32CD32][B]Random background color changer[/B][/COLOR]

    [code]<script>

    // Select fade-effect below:
    // Set 1 if the background may fade from dark to medium
    // Set 2 if the background may fade from light to medium
    // Set 3 if the background may fade from very dark to very light light
    // Set 4 if the background may fade from light to very light
    // Set 5 if the background may fade from dark to very dark
    var fade_effect=3

    // What type of gradient should be applied Internet Explorer 5x or higher?
    // Set "none" or "horizontal" or "vertical"
    var gradient_effect="horizontal"

    // Speed higher=slower
    var speed=60

    //
    // CONFIGURATION ENDS HERE
    //

    var browserinfos=navigator.userAgent
    var ie4=document.all&&!document.getElementById
    var ie5=document.all&&document.getElementById&&!browserinfos.match(/Opera/)
    var ns4=document.layers
    var ns6=document.getElementById&&!document.all
    var opera=browserinfos.match(/Opera/)
    var browserok=ie4||ie5||ns4||ns6||opera

    if (fade_effect==1) {
    var darkmax=1
    var lightmax=127
    }
    if (fade_effect==2) {
    var darkmax=127
    var lightmax=254
    }
    if (fade_effect==3) {
    var darkmax=1
    var lightmax=254
    }
    if (fade_effect==4) {
    var darkmax=190
    var lightmax=254
    }
    if (fade_effect==5) {
    var darkmax=1
    var lightmax=80
    }
    var hexc = new Array('0','1','2','3','4','5','6','7','8','9','A','B','C','D','E','F')

    var newred
    var newgreen
    var newblue
    var oldred
    var oldgreen
    var oldblue

    var redcol_1
    var redcol_2
    var greencol_1
    var greencol_2
    var bluecol_1
    var bluecol_2
    var oldcolor
    var newcolor
    var firsttime=true

    var stepred=1
    var stepgreen=1
    var stepblue=1

    function setrandomcolor() {
    var range=(lightmax-darkmax)
    if (firsttime) {
    newred=Math.ceil(range*Math.random())+darkmax
    newgreen=Math.ceil(range*Math.random())+darkmax
    newblue=Math.ceil(range*Math.random())+darkmax
    firsttime=false
    }

    oldred=Math.ceil(range*Math.random())+darkmax
    oldgreen=Math.ceil(range*Math.random())+darkmax
    oldblue=Math.ceil(range*Math.random())+darkmax

    stepred=newred-oldred
    if (oldred>newred) {stepred=1}
    else if (oldred<newred) {stepred=-1}
    else {stepred=0}

    stepgreen=newgreen-oldgreen
    if (oldgreen>newgreen) {stepgreen=1}
    else if (oldgreen<newgreen) {stepgreen=-1}
    else {stepgreen=0}

    stepblue=newblue-oldblue
    if (oldblue>newblue) {stepblue=1}
    else if (oldblue<newblue) {stepblue=-1}
    else {stepblue=0}
    fadebg()
    }

    function fadebg() {
    if (newred==oldred) {stepred=0}
    if (newgreen==oldgreen) {stepgreen=0}
    if (newblue==oldblue) {stepblue=0}
    newred+=stepred
    newgreen+=stepgreen
    newblue+=stepblue

    if (stepred!=0 || stepgreen!=0 || stepblue!=0) {
    redcol_1 = hexc[Math.floor(newred/16)];
    redcol_2 = hexc[newred%16];
    greencol_1 = hexc[Math.floor(newgreen/16)];
    greencol_2 = hexc[newgreen%16];
    bluecol_1 = hexc[Math.floor(newblue/16)];
    bluecol_2 = hexc[newblue%16];
    newcolor="#"+redcol_1+redcol_2+greencol_1+greencol_2+bluecol_1+bluecol_2
    if (ie5 && gradient_effect!="none") {
    if (gradient_effect=="horizontal") {gradient_effect=1}
    if (gradient_effect=="vertical") {gradient_effect=0}
    greencol_1 = hexc[Math.floor(newred/16)];
    greencol_2 = hexc[newred%16];
    bluecol_1 = hexc[Math.floor(newgreen/16)];
    bluecol_2 = hexc[newgreen%16];
    redcol_1 = hexc[Math.floor(newblue/16)];
    redcol_2 = hexc[newblue%16];
    var newcolorCompl="#"+redcol_1+redcol_2+greencol_1+greencol_2+bluecol_1+bluecol_2
    document.body.style.filter=
    "progid:DXImageTransform.Microsoft.Gradient(startColorstr="+newcolorCompl+", endColorstr="+newcolor+" GradientType="+gradient_effect+")"
    }
    else {
    document.bgColor=newcolor
    }
    var timer=setTimeout("fadebg()",speed);
    }
    else {
    clearTimeout(timer)
    newred=oldred
    newgreen=oldgreen
    newblue=oldblue
    oldcolor=newcolor
    setrandomcolor()
    }
    }

    if (browserok) {
    window.onload=setrandomcolor
    }
    </script>[/code][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i]
     
    • Thanks Thanks x 2
  2. SliceGFX

    SliceGFX Newbie

    Joined:
    Dec 16, 2009
    Messages:
    16
    Likes Received:
    4
    Not really sure why these javascript snippets would be useful. No 'useful' website would throw these things at their users like that.
     
  3. PHPInjected

    PHPInjected Elite Member

    Joined:
    Apr 25, 2014
    Messages:
    2,148
    Likes Received:
    1,911
    Occupation:
    100% Unique Content Writer
    Location:
    Overriding Methods
    That is why it is in general programming "chat".
     
  4. FluidCode

    FluidCode Newbie

    Joined:
    Aug 10, 2014
    Messages:
    9
    Likes Received:
    4
    Location:
    Behind you
    I really like the google search one :D Good work