Page 5 of 17 FirstFirst ... 3456715 ... LastLast
Results 41 to 50 of 161

Thread: Free JavaScript codes

  1. #41
    JavaScriptBank is offline Unknown Net Builder
    Join Date
    Sep 2009
    Posts
    151
    Thanks
    0
    Thanked 5 Times in 5 Posts

    Horizontal Slider JavaScript v2.2

    Cross-Browser DHTML Horizontal Slide Show: JavaScript concatenates and slides any number of images from right to left. Adjustable: Size, Backgroun... detail at JavaScriptBank.com - 2.000+ free JavaScript codes


    How to setup

    Step 1: Use CSS code below for styling the script
    CSS
    Code:
    <STYLE type=text/css>A {
    	TEXT-DECORATION: none
    }
    A:link {
    	COLOR: blue
    }
    A:visited {
    	COLOR: blue
    }
    A:hover {
    	COLOR: red; BACKGROUND-COLOR: #66ffff
    }
    .tab {
    	FONT-SIZE: 12px; FONT-FAMILY: Arial,Helvetica
    }
    .tabc {
    	FONT-WEIGHT: bold; FONT-SIZE: 12px; COLOR: navy; FONT-FAMILY: Arial,Helvetica; TEXT-ALIGN: center
    }
    .tabt {
    	FONT-WEIGHT: bold; FONT-SIZE: 18px; COLOR: red; FONT-FAMILY: Arial,Helvetica; TEXT-ALIGN: center
    }
    </STYLE>
    	<!--
        	This script downloaded from www.JavaScriptBank.com
        	Come to view and download over 2000+ free javascript at www.JavaScriptBank.com
    	-->
    Step 2: Copy & Paste JavaScript code below in your HEAD section
    JavaScript
    Code:
    <SCRIPT language=JavaScript>
    if(top.location != self.location)
    top.location.replace(self.location);
    </SCRIPT>
    
    <SCRIPT language=javascript>
    
    //If using any portion of this DEMO script,
    //one must insert along this notice too:
    
    
    /***********************************
    	vasile barsan
    *   http://javascripts.vbarsan.com/
    *   This notice may not be removed 
    ***********************************/
    
    var swidth=310;var sheight=50;var sspeed=2;var resspeed=sspeed;var restart=sspeed;var rspeed=sspeed;var imagef='';
    preload1 = new Image();
    preload1.src = "../image/gif_logojsb2.gif";
    preload2 = new Image();
    preload2.src = "../image/gif_logojsb.gif";
    preload3 = new Image();
    preload3.src = "../image/gif_logojsb2.gif";
    var leftimage=new Array();
    leftimage[0]='<a href="http://javascriptbank.com"><img src='+preload1.src+' width=310 height=47 alt="JavaScript Bank"></a>';
    leftimage[1]='<a href="http://javascriptbank.com"><img src='+preload2.src+' width=310 height=47 alt="JavaScript Bank"></a>';
    leftimage[2]='<a href="http://javascriptbank.com"><img src='+preload3.src+' width=310 height=47 alt="JavaScript Bank"></a>';
    for(mi=0;mi<leftimage.length;mi++)imagef=imagef+leftimage[mi];
    function goup(){if(sspeed!=rspeed*8){sspeed=sspeed*2;restart=sspeed;}}
    function start(){if(document.getElementById)firstns6(document.getElementById('slider'));else if(document.all)firstie(slider);else if(document.layers)firstns4(document.slider1.document.slider2);}
    var operbr=navigator.userAgent.toLowerCase().indexOf('opera');if(operbr==-1&&navigator.product&&navigator.product=="Gecko"){var agt = navigator.userAgent.toLowerCase();var rvStart = agt.indexOf('rv:');var rvEnd = agt.indexOf(')', rvStart);var check15 = agt.substring(rvStart+3, rvEnd);if(parseFloat(check15)>=1.8) operbr=0;}if (navigator.appVersion.indexOf("Mac")!=-1)operbr=0;
    function firstns4(whichdiv){tdivns4=eval(whichdiv);tdivns4.document.write('<nobr>'+imagef+'</nobr>');tdivns4.document.close();thel=tdivns4.document.width;tdivns4.left=swidth;slidens4();}
    function slidens4(){if(tdivns4.left>=thel*(-1)){tdivns4.left-=sspeed;setTimeout("slidens4()",100);}else{tdivns4.left=swidth;slidens4();}}
    function firstie(whichdiv){tdivie=eval(whichdiv);tdivie.innerHTML=('<nobr>'+imagef+'</nobr>');thel=tdivie.offsetWidth;tdivie.style.pixelLeft=swidth;slideie();}
    function slideie(){if(tdivie.style.pixelLeft>thel*(-1)){tdivie.style.pixelLeft-=sspeed;setTimeout("slideie()",100);}else{tdivie.style.pixelLeft=swidth;slideie();}}
    function firstns6(whichdiv){tdiv6=eval(whichdiv);tdiv6.innerHTML=('<nobr>'+imagef+'</nobr>');thel=tdiv6.offsetWidth;if(operbr!=-1){opslider.innerHTML='<nobr>'+imagef+'</nobr>';thel=opslider.offsetWidth;}tdiv6.style.left=swidth;slidens6();}
    function slidens6(){if(parseInt(tdiv6.style.left)>=thel*(-1)){tdiv6.style.left=parseInt(tdiv6.style.left)-sspeed;setTimeout("slidens6()",100);}else{tdiv6.style.left=swidth;slidens6();}}
    </SCRIPT>
    	<!--
        	This script downloaded from www.JavaScriptBank.com
        	Come to view and download over 2000+ free javascript at www.JavaScriptBank.com
    	-->
    Step 3: Copy & Paste HTML code below in your BODY section
    HTML
    Code:
    <BODY onload=start();>
    <SCRIPT language=javascript>document.write('<table border=2 align="center" bgcolor="#ccffcc"><tr><td bgcolor="#ffffcc"><div class=tabc><b><a class=tab href="#" onClick="goup();">Speed<br>UP</a></b></div></td><td width='+swidth+'>');if(document.layers)document.write('<span style="borderWidth:0.1px; borderStyle:none; clip:rect(0 '+swidth+' '+sheight+' 0);"><ilayer width='+swidth+' height='+sheight+' name="slider1"><layer class=tabt width='+swidth+' height='+sheight+'>SLIDING SHOW</layer><layer width='+swidth+' height='+sheight+' name="slider2" onMouseover="sspeed=0;" onMouseout="sspeed=resspeed"></layer></ilayer></span>');else {document.write('<div style="position:relative;overflow:hidden;width:'+swidth+';height:'+sheight+';clip:rect(0 '+swidth+' '+sheight+' 0);">');if(operbr!=-1)document.write('<div id="opslider" style="position:absolute;visibility:hidden;"></div>');else document.write('<div class=tabt style="position:absolute;width:'+swidth+';height:'+sheight+';">SLIDING SHOW</div>');document.write('<div id="slider" style="position:relative;height:'+sheight+';" onMouseover="sspeed=0;" onMouseout="sspeed=resspeed"></div></div>');}</SCRIPT>
    </TD></TR></TABLE><BR>
    </fieldset>
    </center>
    <SCRIPT language=JavaScript>
    function ctrlA0(corp) {
    with(corp){
    focus(); select()
    }
    if(document.all){
    txt=corp.createTextRange()
    txt.execCommand("Copy")
    window.status='Text copied to clipboard'
    }
    else window.status='Press ctrl-c to copy the text to the clipboard'
    setTimeout("window.status=''",5000)
    }
    </SCRIPT>
    </body>
    	<!--
        	This script downloaded from www.JavaScriptBank.com
        	Come to view and download over 2000+ free javascript at www.JavaScriptBank.com
    	-->






  2. #42
    trose7 is offline Unknown Net Builder
    Join Date
    Mar 2010
    Posts
    8
    Thanks
    0
    Thanked 0 Times in 0 Posts
    That's a lot of code for a simple feature! Is there a way to get a more condensed code? How much resources does that code take?

  3. #43
    JavaScriptBank is offline Unknown Net Builder
    Join Date
    Sep 2009
    Posts
    151
    Thanks
    0
    Thanked 5 Times in 5 Posts

    3D self-revolving cube

    This is a spinning three dimensional cube. Eight dots revolve by itself to create a motional cube.... detail at JavaScriptBank.com - 2.000+ free JavaScript codes


    How to setup

    Step 1: Copy & Paste JavaScript code below in your HEAD section
    JavaScript
    Code:
    <SCRIPT language=javascript>
    /*
         This script downloaded from www.JavaScriptBank.com
         Come to view and download over 2000+ free javascript at www.JavaScriptBank.com
    */
    
    <!-- // (c) 2001 Till Nagel, till@netzministerium.de & Rene Sander, rene@netzministerium.de
    
    // ---------------------------------------------------------------------------
    
    // creates cube model with name and (a simple) material
    var cubeModel = new Model("cube", new Material("&deg;"));
    
    // defines model points.
    // The model's points have to be defined before the respective code is written into the document.
    cubeModel.setPoints(createCubeModelPoints());
    
    
    // ---------------------------------------------------------------------------
    
    // the matrix to transform the model with
    var staticRotationMatrix = new Matrix();
    staticRotationMatrix.rotateX(0.05);
    staticRotationMatrix.rotateY(0.1);
    
    // ---------------------------------------------------------------------------
    
    function initOnLoad() {
    	fixNetscape();
    	
    	// assign layer (only for Netscape 4.x, for all other browsers
    	// this is done automatically when writing the point code)
    	cubeModel.assignLayers();
    	
    	// creates and inits matrix to initialize the model
    	var initMatrix = new Matrix();
    	initMatrix.scale(50, 50, 50);
    	// >> begin to work with the model etc.
    
    	// initializes model
    	cubeModel.transform(initMatrix);
    	
    	// >> first draw of the model (recommended)
    	cubeModel.draw();
    	
    	// starts animation
    	animate();
    }
    
    /*
     * The main animate method. Calls itself repeatedly.
     */
    function animate() {
    	var delay = 10;
    	
    	// animates cube model ----------------------------------------
    
    	// rotates the cube
    	cubeModel.transform(staticRotationMatrix);
    	
    	// updates display
    	cubeModel.draw();
    	
    	// calls itself with an delay to decouple client computer speed from the animation speed.
    	// result: the animation is as fast as possible.
    	setTimeout("animate()", delay);
    }
    
    
    
    // ---------------------------------------------------------------------------
    
    function createCubeModelPoints() {
    	// the cube model
    	return new Array(
    		//  Point3D( x,  y,  z, m)
    		new Point3D( 1,  1,  1, 0),
    		new Point3D( 1,  1, -1, 0),
    		new Point3D( 1, -1,  1, 0),
    		new Point3D( 1, -1, -1, 0),
    		new Point3D(-1,  1,  1, 0),
    		new Point3D(-1,  1, -1, 0),
    		new Point3D(-1, -1,  1, 0),
    		new Point3D(-1, -1, -1, 0)
    	);
    }
    
    // -->
    </SCRIPT>
    Step 2: Copy & Paste HTML code below in your BODY section
    HTML
    Code:
    <DIV id=fixnetscape style="POSITION: absolute; VISIBILITY: hidden"></DIV>
    <SCRIPT language=JavaScript type=text/javascript>
    	<!-- // (c) 2001 Till Nagel, till@netzministerium.de & Rene Sander, rene@netzministerium.de
    	
    	// MANDATORY: INSERTION OF HTML PART INTO PAGE
    	// creates the HTML code representing the model's points
    	// NB: This is written directly into the page from within the method	
    	cubeModel.createPointCode();
    	
    	// -->
    	</SCRIPT>
    Step 3: must download files below
    Files
    LyrObj.js
    3dhtml.js
    ColorUtil.js
    materials.js







  4. #44
    JavaScriptBank is offline Unknown Net Builder
    Join Date
    Sep 2009
    Posts
    151
    Thanks
    0
    Thanked 5 Times in 5 Posts

    Top 10 Best JavaScript eBooks that Beginners should Learn

    As the title of this post said, you should choose one of these JavaScript ebooks, or some ebooks to start learning if you are JavaScript (or Progamming) beginners. So if you are an expert? Then I hope... detail at JavaScriptBank.com - 2.000+ free JavaScript codes


    How to setup







  5. #45
    JavaScriptBank is offline Unknown Net Builder
    Join Date
    Sep 2009
    Posts
    151
    Thanks
    0
    Thanked 5 Times in 5 Posts

    RSS AJAX Newsticker

    This JavaScript tutorial will show you how to combine RSS, AJAX, and JavaScript to create a real-time RSS ticker.

    Thanks to AJAX... detail at JavaScriptBank.com - 2.000+ free JavaScript codes


    How to setup

    Step 1: Use JavaScript code below to setup the script
    JavaScript
    Code:
    <script type="text/javascript" src="rssticker.js"></script>
    Step 2: Copy & Paste HTML code below in your BODY section
    HTML
    Code:
    CNN:
    <DIV style="HEIGHT: 100px; border-style: dotted; border-width: 1px; background-color: silver; text-align: left;">
    <script type="text/javascript">
    //rss_ticker(RSS_id, cachetime, divId, divClass, delay, optionalswitch)
    new rss_ticker("CNN", 60, "cnnbox", "cnnclass", 200)
    
    </script>
    </DIV>
    <br><br><br>
    Each ticker on the page can be invoked independently, for example:
    <DIV style="HEIGHT: 100px; border-style: dotted; border-width: 1px; background-color: silver; text-align: left;">
    <PRE><script type="text/javascript">
    //rss_ticker(RSS_id, cachetime, divId, divClass, delay, optionalswitch)
    new rss_ticker("CNN", 60, "cnnbox", "cnnclass", 2000)
    </script></PRE>
    
    </DIV>
    Step 3: must download files below
    Files
    rssticker.js







  6. #46
    JavaScriptBank is offline Unknown Net Builder
    Join Date
    Sep 2009
    Posts
    151
    Thanks
    0
    Thanked 5 Times in 5 Posts

    Fading Slide Show

    Displays images continuously in a slideshow presentation format, with a fade effect on image transitions. (Fade in Internet Explorer 4+ only).... detail at JavaScriptBank.com - 2.000+ free JavaScript codes


    How to setup

    Step 1: Use JavaScript code below to setup the script
    JavaScript
    Code:
    <script>
    /* 
    	Original:  CodeLifter.com (support@codelifter.com)
    	Web Site:  http://www.codelifter.com 
    */
    
    // set the following variables
    // Set slideShowSpeed (milliseconds)
    var slideShowSpeed = 5000
    
    // Duration of crossfade (seconds)
    var crossFadeDuration = 3
    
    // Specify the image files
    var Pic = new Array() // don't touch this
    // to add more images, just continue
    // the pattern, adding to the array below
    Pic[0] = 'logojs.gif'
    Pic[1] = 'photo3.jpg'
    Pic[2] = 'logojs.gif'
    Pic[3] = 'photo5.jpg'
    Pic[4] = 'photo2.jpg'
    
    // do not edit anything below this line
    
    var t
    var j = 0
    var p = Pic.length
    var preLoad = new Array()
    for (i = 0; i < p; i++){
       preLoad[i] = new Image()
       preLoad[i].src = Pic[i]
    }
    
    function runSlideShow(){
       if (document.all){
          document.images.SlideShow.style.filter="blendTrans(duration=2)"
          document.images.SlideShow.style.filter="blendTrans(duration=crossFadeDuration)"
          document.images.SlideShow.filters.blendTrans.Apply()      
       }
       document.images.SlideShow.src = preLoad[j].src
       if (document.all){
          document.images.SlideShow.filters.blendTrans.Play()
       }
       j = j + 1
       if (j > (p-1)) j=0
       t = setTimeout('runSlideShow()', slideShowSpeed)
    }
    </script>
    	<!--
        	This script downloaded from www.JavaScriptBank.com
        	Come to view and download over 2000+ free javascript at www.JavaScriptBank.com
    	-->
    Step 2: Copy & Paste HTML code below in your BODY section
    HTML
    Code:
    <body onLoad="runSlideShow()">
    <img id="VU" src="logojs.gif" name='SlideShow'>
    </body>
    	<!--
        	This script downloaded from www.JavaScriptBank.com
        	Come to view and download over 2000+ free javascript at www.JavaScriptBank.com
    	-->






  7. Thanked by:

    javanx3d (20 March, 2010)

  8. #47
    JavaScriptBank is offline Unknown Net Builder
    Join Date
    Sep 2009
    Posts
    151
    Thanks
    0
    Thanked 5 Times in 5 Posts

    VML fireworks script

    This is an interesting fireworks effect with the following attributes:

    + Makes use of VML support in IE5+ to render the stars. No graphics involved.
    + Uses conditional... detail at JavaScriptBank.com - 2.000+ free JavaScript codes


    How to setup

    Step 1: Place CSS below in your HEAD section
    CSS
    Code:
    <STYLE type=text/css>BODY {
    	OVERFLOW-X: hidden
    }
    v\:* {
    	BEHAVIOR: url(#default#VML)
    }
          </STYLE>
    	<!--
        	This script downloaded from www.JavaScriptBank.com
        	Come to view and download over 2000+ free javascript at www.JavaScriptBank.com
    	-->
    Step 2: Copy & Paste JavaScript code below in your HEAD section
    JavaScript
    Code:
    <!--[if IE ]>
    <SCRIPT language=JavaScript>
    // VML fireworks script By Jacco IJzerman , j.ijzerman1@chello.nl
    //Customize fireworks colors:
    colors = new Array();
    colors[0] = new Array('yellow', 'lime');
    colors[1] = new Array('lime', 'green')
    colors[2] = new Array('lime', 'blue');
    colors[3] = new Array('lightyellow', 'purple');
    colors[4] = new Array('lightblue', 'white');
    colors[5] = new Array('blue', 'silver');
    colors[6] = new Array('red', 'fuchsia');
    colors[7] = new Array('yellow', 'red');
    
    maximum = 1000;
    
    vmlobj=''; 
    for(i = 0; i < 12; i++){ 
    vmlobj += '<div id="ster'+i+'" style="position:absolute; left:-50px; top-50px; visibility:hidden; z-index:50;">';
    vmlobj += '<v:shape style="width:15px; height:15px;" fillcolor="yellow" coordorigin="0,0" coordsize="200 200">';
    vmlobj += '<v:path v="m 8,65 l 72,65, 92,11, 112,65, 174,65, 122,100, 142,155,92,121, 42,155, 60,100 x e"/>';
    vmlobj += '<v:stroke on="false" /></v:shape></div>';
    }
    document.write(vmlobj); vmlobj = null;
    
    aantal = 0;
    
    function begin()
    {
    try {
    if(aantal == maximum){ return;}
    kleurschema = Math.floor(Math.random() * colors.length);
    posLinks = Math.floor(Math.random() * (document.body.clientWidth - 180));
    posLinks = (posLinks < 170)? 170: posLinks;
    posBoven = Math.floor(Math.random() * (document.body.clientHeight - 180));
    posBoven = (posBoven < 170)? 170: posBoven;
    straal = 0; uiteen = true; teller = 1; flikkereffect = false;
    for(var i = 0; i < 12; i++){
    document.getElementsByTagName('shape')[i].setAttribute('fillcolor', colors[kleurschema][0]);
    document.getElementById('ster'+i).style.visibility = 'hidden'; // 5.0 fix
    document.getElementById('ster'+i).style.left = posLinks;
    document.getElementById('ster'+i).style.top = posBoven;
    }
    document.getElementById('ster0').style.top = (document.body.clientHeight - 20); 
    document.getElementById('ster0').style.visibility = 'visible';
    omhoog();
    } catch(e){}
    }
    
    function omhoog()
    {
    try {
    positie = parseInt(document.getElementById('ster0').style.top);
    if(positie > posBoven){
    document.getElementById('ster0').style.top = (positie - 25); 
    setTimeout('omhoog()', 50);
    } else {
    for(i = 1; i < 12; i++){
    document.getElementById('ster'+i).style.top = positie;
    document.getElementById('ster'+i).style.visibility = 'visible';
    } 
    uiteenspatten();
    }
    } catch(e){}
    }
    
    function uiteenspatten()
    {
    try {
    if(straal > 120 && straal % 10 == 0){ 
    flikkereffect = true;
    teller = (teller == colors[kleurschema].length)? 0: (teller+1);
    }
    for(var i = 0; i < 12; i++){
    var hoek = i * 30; 
    var piHoek = Math.PI - Math.PI / 180 * hoek;
    var links = posLinks + Math.round(straal * Math.sin(piHoek)); 
    var boven = positie + Math.round(straal * Math.cos(piHoek));
    document.getElementById('ster'+i).style.left = links;
    document.getElementById('ster'+i).style.top = boven;
    if(flikkereffect){
    document.getElementsByTagName('shape')[i].setAttribute('fillcolor', colors[kleurschema][teller]);
    }
    }
    if(straal < 160 && uiteen){
    straal += (straal < 120)? 10: 5;
    setTimeout('uiteenspatten()', 50);
    }
    else if(straal > 120){
    uiteen = false; straal -= 5;
    setTimeout('uiteenspatten()', 50);
    }
    else if(straal <= 120){
    for(var i = 0; i < 12; i++){
    document.getElementById('ster'+i).style.visibility = 'hidden';
    }
    aantal++;
    setTimeout('begin()', 500);
    }
    } catch(e) {}
    }
    
    window.onload=begin;
    
    </SCRIPT><![endif]-->
    	<!--
        	This script downloaded from www.JavaScriptBank.com
        	Come to view and download over 2000+ free javascript at www.JavaScriptBank.com
    	-->






  9. #48
    JavaScriptBank is offline Unknown Net Builder
    Join Date
    Sep 2009
    Posts
    151
    Thanks
    0
    Thanked 5 Times in 5 Posts

    Vertical Marquee

    Text scrolls from bottom to top, pauses, then scrolls up and out of view. A JavaScript link can be added, opening in a new window. Configuration is simple.... detail at JavaScriptBank.com - 2.000+ free JavaScript codes


    How to setup

    Step 1: Use CSS code below for styling the script
    CSS
    Code:
    <style type="text/css">
    #jump_base {
      overflow-y:hidden;
      width: 200px;
      height: 100px;
      border: 2px dotted #000099;
      margin: auto;
      padding: 0 10px 0 10px;
      font-size: .9em;
      font-family: Verdana, Arial, sans-serif;
    }
    
    #jump_base a {
      color: #000099;
      background-color: inherit;
    }
    
    .news {
      background-color: #DDDDDD;
      color: inherit;
    }
    </style>
    	<!--
        	This script downloaded from www.JavaScriptBank.com
        	Come to view and download over 2000+ free javascript at www.JavaScriptBank.com
    	-->
    Step 2: Place JavaScript below in your HEAD section
    JavaScript
    Code:
    <script language="javascript">
    // Created by: Mike Hudson :: http://www.afrozeus.com
    
    /*
    To change the values in the setupLinks function below.
    You will notice there are two arrays for each of Titles and
    Links. Currently there are 3 items in each array, but you can easily
    expand on that by adding to the array. For example, to add a 4th record,
    you would simply include the following 2 lines at the end of setupLinks
    function:
    
    arrLinks[3] = "someURL.htm";
    arrTitles[3] = "Some title";
    */
    function setupLinks() {
      arrLinks[0] = "http://forums.webdeveloper.com/forumdisplay.php?s=&forumid=3";
      arrTitles[0] = "If you have any questions, be sure to visit our forums.";
      arrLinks[1] = "http://javascript.internet.com/new/";
      arrTitles[1] = "Don't miss anything — check our new additions.";
      arrLinks[2] = "http://www.webreference.com/programming/javascript/diaries/";
      arrTitles[2] = "Want to learn JavaScript? Start at the beginning.";
    }
    
    var m_iInterval;
    var m_Height;
    //window.onload = wl;
    var iScroll=0;
    
    var arrLinks;
    var arrTitles;
    
    var arrCursor = 0;
    
    var arrMax;
    window.onload=wl;
    
    function wl() {
      m_iInterval = setInterval(ontimer, 10);
      var base = document.getElementById("jump_base");
    
      m_Height = base.offsetHeight;
    
      var divi = parseInt(m_Height/5);
      m_Height = divi*5;
    
      var td1 = document.getElementById("td1");
      var td2 = document.getElementById("td2");
      var td3 = document.getElementById("td3");
      td1.height = m_Height-5;
      td2.height = m_Height-5;
      td3.height = m_Height-5;
    
      arrLinks = new Array();
      arrTitles = new Array();
    
      setupLinks();
      arrMax = arrLinks.length-1;
      setLink();
    }
    function setLink() {
      var ilink = document.getElementById("jump_link");
      ilink.innerHTML = arrTitles[arrCursor];
      ilink.href = arrLinks[arrCursor];
    }
    function ontimer() {
      var base = document.getElementById("jump_base");
      iScroll+=5;
      if (iScroll>(m_Height*2)) {
        iScroll=0;
        arrCursor++;
        if (arrCursor>arrMax)
          arrCursor=0;
        setLink();
      }
      if (iScroll==m_Height) {
        pause();
        m_iInterval = setTimeout(resume, 4000);
      }
      base.scrollTop=iScroll;
    }
    function pause() {
      clearInterval(m_iInterval);
    }
    function resume() {
      m_iInterval = setInterval(ontimer, 10);
    }
    
    
    </script>
    	<!--
        	This script downloaded from www.JavaScriptBank.com
        	Come to view and download over 2000+ free javascript at www.JavaScriptBank.com
    	-->
    Step 3: Place HTML below in your BODY section
    HTML
    Code:
    <div id="jump_base" class="news" onmouseover="pause()" onmouseout="resume()">
      <table class="news">
        <tr>
        <td id="td1"> </td></tr>
        <tr><td id = "td2" valign="middle" align="center"><a id="jump_link" href="" target="_new"></a></td></tr>
    
        <tr><td id="td3"> </td></tr>
      </table>
    </div>
    	<!--
        	This script downloaded from www.JavaScriptBank.com
        	Come to view and download over 2000+ free javascript at www.JavaScriptBank.com
    	-->






  10. #49
    JavaScriptBank is offline Unknown Net Builder
    Join Date
    Sep 2009
    Posts
    151
    Thanks
    0
    Thanked 5 Times in 5 Posts

    Extreme Form Field Validator

    Handle and precess all of your form field validations using just one script. This JavaScript can verify numeric strings; monitor the detail at JavaScriptBank.com - 2.000+ free JavaScript codes


    How to setup

    Step 1: Copy & Paste CSS code below in your HEAD section
    CSS
    Code:
    <style>
    #errordiv {
      border: 1px solid red;
      background-color: #FFAFAF;
      display: none;
      width: 50%;
      margin: 5px;
      padding: 5px;
    }
    
    .required {
      background-color: #CC4444;
    }
    
    .required:focus {
      background-color: #fff;
      border: 1px solid #f00;
    }
    
    .checkit {
      background-color: #E0E5EF;
    }
    </style>
    Step 2: Place JavaScript below in your HEAD section
    JavaScript
    Code:
    <script type="text/javascript" src="chkform.js"></script><script type="text/javascript">
    function configureValidation(f,alerttype){
      f.firstname.isAlphaNumeric = true;
      f.lastname.isAlphaNumeric = true;
      f.email.isEmail = true;
      f.phone.isPhoneNumber = true;
      f.birthday.isDate = true;
      f.postalcode.isEmpty = true;
      f.password1.isLengthBetween = [4,255];
      f.password2.isMatch = f.password1.value;
      f.comments.optional = true;
      var preCheck = (!f.infohtml.checked && !f.infocss.checked && !f.infojs.checked) ? errormsg[0] : null;
      return validateForm(f, preCheck, 'required', alerttype);
    }
    </script>
    Step 3: Place HTML below in your BODY section
    HTML
    Code:
    <div>
    <form action="#" method="post" onsubmit="return configureValidation(this,3)" onreset="confirm(errormsg[99])">
    <table class="formtable">
    <tr>
    <td>First Name:</td>
    <td><input class="checkit" type="text" id="First name" name="firstname" value="" class="text"></td>
    </tr>
    <tr>
    <td>Last Name:</td>
    <td><input class="checkit" type="text" id="Last name" name="lastname" value="" class="text"></td>
    
    </tr>
    <tr>
    <td>Email:</td>
    <td><input class="checkit" type="text" id="Email" name="email" value="" class="text"></td>
    </tr>
    <tr>
    <td>Email Preferred:</td>
    <td><select name="emailpreferred">
    <option value="text">Text</option>
    <option value="html">HTML</option>
    <option value="flash">Flash</option>
    </select></td>
    
    </tr>
    <tr>
    <td>Phone: (US only) </td>
    <td><input class="checkit"  type="text" id="Phone" name="phone" value="000-000-0000" class="text"></td>
    </tr>
    <tr>
    <td>Birthday:</td>
    <td><input class="checkit"  type="text" id="Birthday" name="birthday" value="mm-dd-yyyy" class="text"></td>
    </tr>
    <tr>
    <td>Gender:</td>
    <td>Male:<input type="radio"  name="gender" value="male" class="radio" checked="checked"> Female:<input type="radio" name="gender" value="female" class="radio"></td>
    
    </tr>
    <tr>
    <td>Password:</td>
    <td><input class="checkit" onKeyPress="checkCapsLock( event )" id="Password" type="password" name="password1" value="" class="text"></td>
    </tr>
    <tr>
    <td>Re-Enter:</td>
    <td><input class="checkit" onKeyPress="checkCapsLock( event )" id="Password again" type="password" name="password2" value="" class="text"></td>
    </tr>
    <tr>
    <td>Postal Code</td>
    <td><input class="checkit" name="postalcode" type="text" id="Postal code" onKeyPress="javascript:checkNumber(this);" onKeyUp="javascript:checkNumber(this);"></td>
    </tr>
    <tr>
    
    <td colspan="2">Select one or more of the following:</td>
    </tr>
    <tr>
    <td colspan="2">HTML:<input type="checkbox" name="infohtml" value="true" class="checkbox"> CSS:<input type="checkbox" name="infocss" value="true" class="checkbox"> JavaScript:<input type="checkbox" name="infojs" value="true" class="checkbox"></td>
    </tr>
    <tr>
    <td>Comments:</td>
    <td><textarea id="Comment" name="comments" class="text" cols="20" rows="4"></textarea></td>
    </tr>
    
    </table>
    <div id="errordiv"> </div>
    <div>
    <input type="submit" name="submit" value="Submit" class="button"> <input type="reset" name="reset" value="Reset" class="button"></td>
    </form>
    </div>
    Step 4: downloads
    Files
    chkform.js







  11. #50
    JavaScriptBank is offline Unknown Net Builder
    Join Date
    Sep 2009
    Posts
    151
    Thanks
    0
    Thanked 5 Times in 5 Posts

    iPod Player using Flash

    Your website have a sound/music system? Are you looking for a cool music player? And you are fan of Apple/iPod? If your answer is 'Yes', let embed this mp3 player script into your web page then let th... detail at JavaScriptBank.com - 2.000+ free JavaScript codes


    How to setup

    Step 1: Download files below
    Files
    [URL="http://www.javascriptbank.com/javascript/multimedia/iPod_Player_using_Flash/iPod_Player_using_Flash.zip"]







Page 5 of 17 FirstFirst ... 3456715 ... LastLast

Similar Threads

  1. Need Help In JavaScript
    By Zash in forum Programming
    Replies: 1
    Last Post: 10 September, 2010, 19:08 PM
  2. Javascript
    By Sbfc_ in forum Community Building
    Replies: 5
    Last Post: 19 March, 2010, 01:21 AM
  3. Javascript
    By KMRock in forum Programming
    Replies: 0
    Last Post: 29 July, 2009, 02:02 AM
  4. [WTH] $$ for Simple Javascript
    By MarxGrayscaleServices in forum Services
    Replies: 2
    Last Post: 31 May, 2009, 20:31 PM
  5. Use PHP functions in JavaScript
    By ankit in forum Programming
    Replies: 3
    Last Post: 31 May, 2009, 11:12 AM

Tags for this Thread

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •