Helpful JavaScripts to develop website

[JavaScriptBank]

JavaScript codes for Web DEV

Training Lexical Structure and Statements

This free HTML JavaScript tutorial provides some basic JavaScript concepts (http://www.javascriptbank.com/tag=JavaScript concept) for programming newbies. In this post, you will train some categories of JavaScript sta... detail (http://www.javascriptbank.com/training-lexical-structure-statements.html/en//) at JavaScriptBank.com - 2.000+ free JavaScript codes (http://www.javascriptbank.com/)


http://www.javascriptbank.com/javascript.images/article/training-lexical-structure-statements.jpg (http://www.javascriptbank.com/javascript/article/how-to/training-lexical-structure-statements/preview/en/)
Demo: JavaScript Training Lexical Structure and Statements (http://www.javascriptbank.com/training-lexical-structure-statements.html/en/)


How to setup







AJAX news ticker (http://www.javascriptbank.com/rss-ajax-newsticker.html) - JavaScript Refresh Page (http://www.javascriptbank.com/refresh-page-automatic.html/en/) - JavaScript Unclosable Window (http://www.javascriptbank.com/blink.html)


The Site may provide, or third parties may provide, links to non-JavaScriptBank.com Internet World Wide Web sites or resources. Because JavaScriptBank.com has no control over such sites and resources, you acknowledge and agree that JavaScriptBank.com is not responsible for the availability of such external sites or resources, and does not endorse and is not responsible or liable for any content, advertising, products, or other materials on or available from such sites or resources. You further acknowledge and agree that JavaScriptBank.com shall not be responsible or liable, directly or indirectly, for any damage or loss caused or alleged to be caused by or in connection with use of or reliance on any such content, ***** or services available on or through any such site or resource.

[JavaScriptBank]

JavaScript codes for Web DEV

65 Free JavaScript Photo Gallery Solutions

JavaScript photo gallery (http://www.javascriptbank.com/tag=JavaScript photo gallery), JavaScript image gallery (http://www.javascriptbank.com/tag=JavaScript image gallery) and web photo gallery (http://www.javascriptbank.com/tag=web photo gallery) ar... detail (http://www.javascriptbank.com/65-free-javascript-photo-gallery-solutions.html/en//) at JavaScriptBank.com - 2.000+ free JavaScript codes (http://www.javascriptbank.com/)


http://www.javascriptbank.com/javascript.images/article/65-free-javascript-photo-gallery-solutions.jpg (http://www.javascriptbank.com/javascript/article/65-free-javascript-photo-gallery-solutions/preview/en/)
Demo: JavaScript 65 Free JavaScript Photo Gallery Solutions (http://www.javascriptbank.com/65-free-javascript-photo-gallery-solutions.html/en/)


How to setup







JavaScript Countdown Timer (http://www.javascriptbank.com/javascript-countdown-timer.html/en/) - JavaScript Web based Music Player (http://www.javascriptbank.com/web-based-music-player.html) - JavaScript AJAX Page Content Loader
(http://www.javascriptbank.com/ajax-page-content-loader.html)


The Site may provide, or third parties may provide, links to non-JavaScriptBank.com Internet World Wide Web sites or resources. Because JavaScriptBank.com has no control over such sites and resources, you acknowledge and agree that JavaScriptBank.com is not responsible for the availability of such external sites or resources, and does not endorse and is not responsible or liable for any content, advertising, products, or other materials on or available from such sites or resources. You further acknowledge and agree that JavaScriptBank.com shall not be responsible or liable, directly or indirectly, for any damage or loss caused or alleged to be caused by or in connection with use of or reliance on any such content, ***** or services available on or through any such site or resource.

[JavaScriptBank]

Free JavaSccript codes

Smash a Smiley 1.2

Similar to the free JavaScript game Whack the Gopher (http://www.javascriptbank.com/whack-the-gopher-index.html), this JavaScript game is simpler by change the picture of gophers into the ... detail (http://www.javascriptbank.com/smash-a-smiley-1-2.html/en//) at JavaScriptBank.com - 2.000+ free JavaScript codes (http://www.javascriptbank.com/)


http://www.javascriptbank.com/javascript.images/game/smash-a-smiley-1-2.jpg (http://www.javascriptbank.com/javascript/game/smash-a-smiley-1-2/preview/en/)
Demo: JavaScript Smash a Smiley 1.2 (http://www.javascriptbank.com/smash-a-smiley-1-2.html/en/)


How to setup

Step 1: Use JavaScript code below to setup the script
JavaScript

<script language="Javascript">
/*
This script downloaded from www.JavaScriptBank.com
Come to view and download over 2000+ free javascript at www.JavaScriptBank.com
*/
<!--
/*
SMASH a SMILEY 1.2
---------------------------------------------------------------------
Copyright 1997 Tomas Lilje
http://home3.swipnet.se/~w-39426 || e.lilje@swipnet.se
Use this script if you want but don´t put
away this clip, and please drop me
a note. Email comments etc. too
*/

function eraone () {
document.play.first.value="";
}

function eratwo () {
document.play.second.value="";
}

function erathree () {
document.play.third.value="";
}

function erafour () {
document.play.fourth.value="";
}

function erafive () {
document.play.fifth.value="";
}

function erasix () {
document.play.sixth.value="";
}

function eraseven () {
document.play.seventh.value="";
}

function eraeight () {
document.play.eighth.value="";
}

function eranine () {
document.play.ninth.value="";
}

function start () {
document.play.fourth.value=" :-)";
document.play.third.value=" ;-o";
setTimeout("nextone ()",500);
}

function nextone () {
document.play.fourth.value="";
document.play.fifth.value="d:-D";
setTimeout("nexttwo ()",400);
}

function nexttwo () {
document.play.third.value="";
setTimeout("nextthree()",400);
}

function nextthree () {
document.play.seventh.value=":-(";
document.play.first.value=">:-)";
document.play.sixth.value="B-)";
setTimeout("nextfour ()",700);
}

function nextfour () {
document.play.first.value="";
document.play.sixth.value="";
document.play.second.value="=)";
setTimeout("nextfive ()",700);
}

function nextfive () {
document.play.seventh.value="";
document.play.second.value="";
document.play.fourth.value="[:o]";
setTimeout("nextsix ()",800);
}

function nextsix () {
document.play.eighth.value="d:-(";
document.play.second.value=">:-D";
setTimeout("nextseven ()",700);
}

function nextseven () {
document.play.eighth.value="";
document.play.fifth.value=":-)";
setTimeout("nexteight ()",400);
}

function nexteight () {
document.play.ninth.value=";-)"
document.play.fourth.value=":<0";
setTimeout("nextnine ()",500);
}

function nextnine () {
document.play.fifth.value="";
document.play.fourth.value="";
document.play.first.value=":-v";
setTimeout("nextten ()",200);
}

function nextten () {
document.play.third.value="B-)";
document.play.sixth.value=":-(";
setTimeout("nexteleven ()",600);
}

function nexteleven () {
document.play.first.value="";
document.play.seventh.value=";-(";
setTimeout("nexttwelve ()",500);
}

function nexttwelve () {
document.play.second.value="B-o";
document.play.ninth.value=";-(";
setTimeout("nextthirteen ()",700);
}

function nextthirteen () {
document.play.first.value=":-)";
document.play.ninth.value="";
document.play.seventh.value="";
setTimeout("start ()",600);
}

function stop () {
document.play.first.value="";
document.play.second.value="";
document.play.third.value="";
document.play.fourth.value="";
document.play.fifth.value="";
document.play.sixth.value="";
document.play.seventh.value="";
document.play.eighth.value="";
document.play.ninth.value="";
}

function about() {
alert("Smash a Smiley 1.2 is written by Tomas Lilje. You can use this game if you want, but don´t modify it, and please drop me a note. For further versions, please visit TNeT. Email-> e.lilje@swipnet.se TNeT-> http://home3.swipnet.se/~w-39426");
}

function help() {
alert("How to play: Your mission is to hit the smileys, when they show up. ");
}
//-->

</script>

Step 2: Place HTML below in your BODY section
HTML

<!--
/*
This script downloaded from www.JavaScriptBank.com
Come to view and download over 2000+ free javascript at www.JavaScriptBank.com
*/
-->
<table border=8 bgcolor="midnightblue" cellpadding=0 cellspacing=0>
<tr>
<td>
<form name="play">
<center>
<font face="Arial" color="FANTASY" size="4">
<b>Smash a Smiley 1.2
<hr>
<INPUT TYPE="button" NAME="first" OnClick="eraone ()" value=" ">

<INPUT TYPE="button" NAME="second" OnClick="eratwo ()" value=" ">
<INPUT TYPE="button" NAME="third" OnClick="erathree ()" value=" ">
<br>
<INPUT TYPE="button" NAME="fourth" OnClick="erafour ()" value=" ">
<INPUT TYPE="button" NAME="fifth" OnClick="erafive ()" value=" ">
<INPUT TYPE="button" NAME="sixth" OnClick="erasix ()" value=" ">
<br>
<INPUT TYPE="button" NAME="seventh" OnClick="eraseven ()" value=" ">
<INPUT TYPE="button" NAME="eighth" OnClick="eraeight ()" value=" ">
<INPUT TYPE="button" NAME="ninth" OnClick="eranine ()" value=" ">
<br>
<hr>
<INPUT TYPE="button" NAME="startitup" OnClick="start ()" value=" Start ">
<input type="button" name="hbutton" value=" Help" onclick="help()">
<input type="button" name="abutton" value=" About" onclick="about()">
<br>
<hr>

<font size="2">Copyright 1997 Tomas Lilje
</form>
</td>
</tr>
</table>







JavaScript Bookmark Page script (http://www.javascriptbank.com/bookmark-page-script.html) - JavaScript Color Wheel (http://www.javascriptbank.com/color-wheel.html) - JavaScript Image slideshow (http://www.javascriptbank.com/image-slideshow-transition.html)


The Site may provide, or third parties may provide, links to non-JavaScriptBank.com Internet World Wide Web sites or resources. Because JavaScriptBank.com has no control over such sites and resources, you acknowledge and agree that JavaScriptBank.com is not responsible for the availability of such external sites or resources, and does not endorse and is not responsible or liable for any content, advertising, products, or other materials on or available from such sites or resources. You further acknowledge and agree that JavaScriptBank.com shall not be responsible or liable, directly or indirectly, for any damage or loss caused or alleged to be caused by or in connection with use of or reliance on any such content, ***** or services available on or through any such site or resource.

[JavaScriptBank]

Helpful JavaScript for Web development

Strip HTML tags in Rails, JavaScript and PHP

In this HTML JavaScript tutorial, <i>Brijesh Shah</i> guides you create some simple codes in Rails, JavaScript and PHP to strip HTML tags (http://www.javascriptbank.com/tag=strip HTML tag), detail (http://www.javascriptbank.com/tag=strip tag PHP... http://www.javascriptbank.com/javascript.images/article/strip-html-tags-in-rails--javascript-php.jpg (http://www.javascriptbank.com/javascript/article/how-to/strip-html-tags-in-rails--javascript-php/preview/en/)
Demo: JavaScript Strip HTML tags in Rails, JavaScript and PHP (http://www.javascriptbank.com/strip-html-tags-in-rails--javascript-php.html/en/)
[/CENTER]

[U]How to setup







JavaScript Line Graph script (http://www.javascriptbank.com/line-graph-script-index.html) - JavaScript Virtual Keyboard (http://www.javascriptbank.com/virtualkeyboard-index.html) - JavaScript Horizontal Slider (http://www.javascriptbank.com/horizontal-slider-javascript-v2-2.html)


The Site may provide, or third parties may provide, links to non-JavaScriptBank.com Internet World Wide Web sites or resources. Because JavaScriptBank.com has no control over such sites and resources, you acknowledge and agree that JavaScriptBank.com is not responsible for the availability of such external sites or resources, and does not endorse and is not responsible or liable for any content, advertising, products, or other materials on or available from such sites or resources. You further acknowledge and agree that JavaScriptBank.com shall not be responsible or liable, directly or indirectly, for any damage or loss caused or alleged to be caused by or in connection with use of or reliance on any such content, ***** or services available on or through any such site or resource.

[JavaScriptBank]

Helpful JavaScripts to develop website

A Basic AJAX Demo Application Using PHP And JavaScript

This free AJAX JavaScript tutorial (http://www.javascriptbank.com/tag=AJAX JavaScript tutorial) guides you how to build a simple AJAX application using PHP and JavaScript. This free HTMl JavaScript tutorial provides y... detail (http://www.javascriptbank.com/basic-ajax-demo-application-using-php-javascript.html/en//) at JavaScriptBank.com - 2.000+ free JavaScript codes (http://www.javascriptbank.com/)


http://www.javascriptbank.com/javascript.images/article/basic-ajax-demo-application-using-php-javascript.jpg (http://www.javascriptbank.com/javascript/article/how-to/basic-ajax-demo-application-using-php-javascript/preview/en/)
Demo: JavaScript A Basic AJAX Demo Application Using PHP And JavaScript (http://www.javascriptbank.com/basic-ajax-demo-application-using-php-javascript.html/en/)


How to setup







Javascript floating message (http://www.javascriptbank.com/floating-message-scroller.html) - Javascript multi level drop down menu (http://www.javascriptbank.com/javascript-multi-level-drop-down-menu.html) - JavaScript in_array() (http://www.javascriptbank.com/in-array.html)


The Site may provide, or third parties may provide, links to non-JavaScriptBank.com Internet World Wide Web sites or resources. Because JavaScriptBank.com has no control over such sites and resources, you acknowledge and agree that JavaScriptBank.com is not responsible for the availability of such external sites or resources, and does not endorse and is not responsible or liable for any content, advertising, products, or other materials on or available from such sites or resources. You further acknowledge and agree that JavaScriptBank.com shall not be responsible or liable, directly or indirectly, for any damage or loss caused or alleged to be caused by or in connection with use of or reliance on any such content, ***** or services available on or through any such site or resource.

[JavaScriptBank]

Free JavaSccript codes

Marking your Sheet Music Notation with JavaScript

One more wonderful JavaScript web application (http://www.javascriptbank.com/tag=JavaScript web application) created by JavaScript developers, web developers. That is sheet music no... detail (http://www.javascriptbank.com/tag=sheet music notation) at JavaScriptBank.com - 2.000+ free JavaScript codes (http://www.javascriptbank.com/)


http://www.javascriptbank.com/javascript.images/utility/marking-your-sheet-music-notation-with-javascript.jpg (http://www.javascriptbank.com/javascript/utility/marking-your-sheet-music-notation-with-javascript/preview/en/)
Demo: JavaScript Marking your Sheet Music Notation with JavaScript (http://www.javascriptbank.com/marking-your-sheet-music-notation-with-javascript.html/en/)


[U]How to setup

Step 1: Copy & Paste CSS code below in your HEAD section
CSS

<style type="text/css">
canvas{
display:block;
border:1px solid #000;
width:100%;
height:300px;
}
</style>

Step 2: Place JavaScript below in your HEAD section
JavaScript

<script src="canvastext.js"></script>
<script src="ellipse.js"></script>
<script src="notation-viewer.js"></script>
<script src="/javascript/jquery.js"></script>
<script src="js.js"></script>

Step 3: Copy & Paste HTML code below in your BODY section
HTML

<form method="post"><select id="file_chooser" name="file"><option>0001 - john w schaum - at sea level</option><option selected="selected">0002 - john w schaum - seize the cs</option></select><select id="zoom"><option value="2">200%</option><option value="1.5">150%</option><option value="1" selected="selected">100%</option><option value=".8">80%</option><option value=".5">50%</option></select></form><canvas id="canvas"></canvas><script>var music={sp:{"work":"","part-list":{"score-part":{_a:{"id":"P1"},"part-name":"Staff 1","score-instrument":{_a:{"id":"P1-I1"},"instrument-name":"Piano 1"},"midi-instrument":{_a:{"id":"P1-I1"},"midi-channel":"1","midi-program":"1"}}},pa:{_a:{"id":"P1"},me:[{_a:{nu:1},at:{di:"1","key":{"fifths":"0"},ti:"4/4",cl:"F/4"},no:[{pi:{s:0,o:4},d:1,v:1,t:4,"stem":"down"},{pi:{s:0,o:4},d:1,v:1,t:4,"stem":"down"},{pi:{s:0,o:4},d:2,v:1,t:2,"stem":"down"}]},{_a:{nu:2},no:[{pi:{s:0,o:4},d:1,v:1,t:4,"stem":"down"},{pi:{s:0,o:4},d:1,v:1,t:4,"stem":"down"},{pi:{s:0,o:4},d:2,v:1,t:2,"stem":"down"}]},{_a:{nu:3},no:[{pi:{s:0,o:4},d:1,v:1,t:4,"stem":"down"},{pi:{s:6,o:3},d:1,v:1,t:4,"stem":"down"},{pi:{s:0,o:4},d:1,v:1,t:4,"stem":"down"},{pi:{s:6,o:3},d:1,v:1,t:4,"stem":"down"}]},{_a:{nu:4},no:[{pi:{s:5,o:3},d:1,v:1,t:4,"stem":"down"},{pi:{s:6,o:3},d:1,v:1,t:4,"stem":"down"},{pi:{s:0,o:4},d:2,v:1,t:2,"stem":"down"}]},{_a:{nu:5},no:[{pi:{s:0,o:4},d:1,v:1,t:4,"stem":"down"},{pi:{s:0,o:4},d:1,v:1,t:4,"stem":"down"},{pi:{s:0,o:4},d:2,v:1,t:2,"stem":"down"}]},{_a:{nu:6},no:[{pi:{s:0,o:4},d:1,v:1,t:4,"stem":"down"},{pi:{s:0,o:4},d:1,v:1,t:4,"stem":"down"},{pi:{s:0,o:4},d:2,v:1,t:2,"stem":"down"}]},{_a:{nu:7},no:[{pi:{s:0,o:4},d:1,v:1,t:4,"stem":"down"},{pi:{s:6,o:3},d:1,v:1,t:4,"stem":"down"},{pi:{s:5,o:3},d:1,v:1,t:4,"stem":"down"},{pi:{s:6,o:3},d:1,v:1,t:4,"stem":"down"}]},{_a:{nu:8},no:[{pi:{s:0,o:4},d:1,v:1,t:4,"stem":"down"},{pi:{s:6,o:3},d:1,v:1,t:4,"stem":"down"},{pi:{s:0,o:4},d:2,v:1,t:2,"stem":"down"}],"barline":{_a:{"location":"right"},"bar-style":"light-heavy"}}]}}};</script>

Step 4: downloads
Files
canvastext.js (http://www.javascriptbank.com/javascript/utility/Marking_your_Sheet_Music_Notation_with_JavaScript/canvastext.js)
ellipse.js (http://www.javascriptbank.com/javascript/utility/Marking_your_Sheet_Music_Notation_with_JavaScript/ellipse.js)
jquery.js (http://www.javascriptbank.com/javascript/utility/Marking_your_Sheet_Music_Notation_with_JavaScript/jquery.js)
js.js (http://www.javascriptbank.com/javascript/utility/Marking_your_Sheet_Music_Notation_with_JavaScript/js.js)
notation-viewer.js (http://www.javascriptbank.com/javascript/utility/Marking_your_Sheet_Music_Notation_with_JavaScript/notation-viewer.js)







JavaScript Enlarge Image (http://www.javascriptbank.com/enlarge-image-2.html/en/) - JavaScript Fading Slide Show (http://www.javascriptbank.com/fading-slide-show.html) - JavaScript Rotating Image script (http://www.javascriptbank.com/rotating-image-script.html)


The Site may provide, or third parties may provide, links to non-JavaScriptBank.com Internet World Wide Web sites or resources. Because JavaScriptBank.com has no control over such sites and resources, you acknowledge and agree that JavaScriptBank.com is not responsible for the availability of such external sites or resources, and does not endorse and is not responsible or liable for any content, advertising, products, or other materials on or available from such sites or resources. You further acknowledge and agree that JavaScriptBank.com shall not be responsible or liable, directly or indirectly, for any damage or loss caused or alleged to be caused by or in connection with use of or reliance on any such content, ***** or services available on or through any such site or resource.

[JavaScriptBank]

JavaScript codes for Web DEV

Automating Tasks with Windows Script Host and JScript JavaScript

This free HTML JavaScript tutorial guides you how to create some simple automating tasks on your computer with Windows Script Host (WSH) and JScript JavaScript, without any third part software. Please... detail (http://www.javascriptbank.com/automating-tasks-with-windows-script-host-jscript-javascript.html/en//) at JavaScriptBank.com - 2.000+ free JavaScript codes (http://www.javascriptbank.com/)


http://www.javascriptbank.com/javascript.images/article/automating-tasks-with-windows-script-host-jscript-javascript.jpg (http://www.javascriptbank.com/javascript/article/how-to/automating-tasks-with-windows-script-host-jscript-javascript/preview/en/)
Demo: JavaScript Automating Tasks with Windows Script Host and JScript JavaScript (http://www.javascriptbank.com/automating-tasks-with-windows-script-host-jscript-javascript.html/en/)


How to setup







JavaScript Vertical Marquee (http://www.javascriptbank.com/vertical-marquee.html) - JavaScript DHTML analog clock (http://www.javascriptbank.com/dhtml-analog-clock-ii.html/en/) - JavaScript Backwards Text (http://www.javascriptbank.com/backwards-text-2-index.html)


The Site may provide, or third parties may provide, links to non-JavaScriptBank.com Internet World Wide Web sites or resources. Because JavaScriptBank.com has no control over such sites and resources, you acknowledge and agree that JavaScriptBank.com is not responsible for the availability of such external sites or resources, and does not endorse and is not responsible or liable for any content, advertising, products, or other materials on or available from such sites or resources. You further acknowledge and agree that JavaScriptBank.com shall not be responsible or liable, directly or indirectly, for any damage or loss caused or alleged to be caused by or in connection with use of or reliance on any such content, ***** or services available on or through any such site or resource.

[jalicia18]

thanks for sharing those scripts.

[JavaScriptBank]

JavaScript codes for Web DEV

Essential jQuery Examples for Web Designers

jQuery is becoming more important than we think, although it's just JavaScript framework to help web coders, web programmers write the interactive tasks. However, with the higher requirements of moder... detail (http://www.javascriptbank.com/essential-jquery-examples-web-designers.html/en//) at JavaScriptBank.com - 2.000+ free JavaScript codes (http://www.javascriptbank.com/)


http://www.javascriptbank.com/javascript.images/article/essential-jquery-examples-web-designers.jpg (http://www.javascriptbank.com/javascript/article/essential-jquery-examples-web-designers/preview/en/)
Demo: JavaScript Essential jQuery Examples for Web Designers (http://www.javascriptbank.com/essential-jquery-examples-web-designers.html/en/)


How to setup







JavaScript Countdown Timer (http://www.javascriptbank.com/javascript-countdown-timer.html/en/) - JavaScript Web based Music Player (http://www.javascriptbank.com/web-based-music-player.html) - JavaScript AJAX Page Content Loader
(http://www.javascriptbank.com/ajax-page-content-loader.html)


The Site may provide, or third parties may provide, links to non-JavaScriptBank.com Internet World Wide Web sites or resources. Because JavaScriptBank.com has no control over such sites and resources, you acknowledge and agree that JavaScriptBank.com is not responsible for the availability of such external sites or resources, and does not endorse and is not responsible or liable for any content, advertising, products, or other materials on or available from such sites or resources. You further acknowledge and agree that JavaScriptBank.com shall not be responsible or liable, directly or indirectly, for any damage or loss caused or alleged to be caused by or in connection with use of or reliance on any such content, ***** or services available on or through any such site or resource.

[JavaScriptBank]

Helpful JavaScript for Web development

Simple JavaScript Chat Box with OOP Skill

This JavaScript code example (JavaScript chat code) just help you learn more OOP in JavaScript by making a message box with chat-style window. A simple free JavaScript chat effect with a few codelines... detail (http://www.javascriptbank.com/simple-javascript-chat-box-with-oop-skill.html/en//) at JavaScriptBank.com - 2.000+ free JavaScript codes (http://www.javascriptbank.com/)


http://www.javascriptbank.com/javascript.images/misc/simple-javascript-chat-box-with-oop-skill.jpg (http://www.javascriptbank.com/javascript/misc/simple-javascript-chat-box-with-oop-skill/preview/en/)
Demo: JavaScript Simple JavaScript Chat Box with OOP Skill (http://www.javascriptbank.com/simple-javascript-chat-box-with-oop-skill.html/en/)


How to setup

Step 1: Use CSS code below for styling the script
CSS

<style type="text/css">
div#list {
background-color: #DFDFDF;
color: #000;
overflow: scroll;
width: 15em;
height: 10em;
padding: 10px;
text-align: left;
}
</style>

Step 2: Place JavaScript below in your HEAD section
JavaScript

<script type="text/javascript">
// Created by: James Robertson | http://www.r0bertson.co.uk
// This script downloaded from www.JavaScriptBank.com

function addText() {
olist = document.getElementById('list');
op = document.createElement('p');
op.innerHTML = 'More text ...';
ocontent = document.getElementById('content');
ocontent.appendChild(op);
olist.scrollTop = olist.scrollHeight;
}
</script>

Step 3: Copy & Paste HTML code below in your BODY section
HTML

<p>A simple chat-style display</p>

<div id="list">
<div id="content">
<p class="other_user">Good afternoon. How are you?</p>
<p class="other_user">Hello?</p>
<p class="other_user">Is anybody there?</p>
</div>
</div>
<p>
<div id="toolbar"><input type="button" value="add text" onclick="addText()" /></div>







JavaScript Make link open in new tab/window (http://www.javascriptbank.com/make-link-open-in-new-tab-window.html/en/) - JavaScript World clock (http://www.javascriptbank.com/world-clock-with-unique-display.html/en/) - circumference calculator (http://www.javascriptbank.com/circumference-calculator.html/en/)


The Site may provide, or third parties may provide, links to non-JavaScriptBank.com Internet World Wide Web sites or resources. Because JavaScriptBank.com has no control over such sites and resources, you acknowledge and agree that JavaScriptBank.com is not responsible for the availability of such external sites or resources, and does not endorse and is not responsible or liable for any content, advertising, products, or other materials on or available from such sites or resources. You further acknowledge and agree that JavaScriptBank.com shall not be responsible or liable, directly or indirectly, for any damage or loss caused or alleged to be caused by or in connection with use of or reliance on any such content, ***** or services available on or through any such site or resource.

[JavaScriptBank]

JavaScript codes for Web DEV

Simple JavaScript Number Formatter

This JavaScript code example provides us two functions to clean up and format numbers quite nicely.

One JavaScript check number (http://www.javascriptbank.com/=JavaScript check number) function will take any decima... detail (http://www.javascriptbank.com/simple-javascript-number-formatter.html/en//) at JavaScriptBank.com - 2.000+ free JavaScript codes (http://www.javascriptbank.com/)


http://www.javascriptbank.com/javascript.images/form/simple-javascript-number-formatter.jpg (http://www.javascriptbank.com/javascript/form/simple-javascript-number-formatter/preview/en/)
Demo: JavaScript Simple JavaScript Number Formatter (http://www.javascriptbank.com/simple-javascript-number-formatter.html/en/)


How to setup

Step 1: Copy & Paste JavaScript code below in your HEAD section
JavaScript

<script type="text/javascript">
// Created by: Justin Barlow | http://www.netlobo.com/
// This script downloaded from www.JavaScriptBank.com

// This function formats numbers by adding commas
function numberFormat(nStr){
nStr += '';
x = nStr.split('.');
x1 = x[0];
x2 = x.length > 1 ? '.' + x[1] : '';
var rgx = /(\d+)(\d{3})/;
while (rgx.test(x1))
x1 = x1.replace(rgx, '$1' + ',' + '$2');
return x1 + x2;
}

// This function removes non-numeric characters
function stripNonNumeric( str ){
str += '';
var rgx = /^\d|\.|-$/;
var out = '';
for( var i = 0; i < str.length; i++ ){
if( rgx.test( str.charAt(i) ) ){
if( !( ( str.charAt(i) == '.' && out.indexOf( '.' ) != -1 ) ||
( str.charAt(i) == '-' && out.length != 0 ) ) ){
out += str.charAt(i);
}
}
}
return out;
}
</script>

Step 2: Copy & Paste HTML code below in your BODY section
HTML

<div>
numberFormat():<br>

<form method="get" onsubmit="javascript:return false;">
<input type="text" onkeyup="javascript:document.getElementById('numFormatResul t').innerHTML = numberFormat( this.value );">

<input type="reset" value="clear">
</form>
<span id="numFormatResult"></span>
<br><br>
stripNonNumeric():<br>
<form method="get" onsubmit="javascript:return false;">

<input type="text" onkeyup="javascript:document.getElementById('numStripResult ').innerHTML = stripNonNumeric( this.value );">
<input type="reset" value="clear">

</form>
<span id="numStripResult"></span>
<br><br>
stripNonNumeric() then numberFormat():<br>
<form method="get" onsubmit="javascript:return false;">
<input type="text" onkeyup="javascript:document.getElementById('numBothResult' ).innerHTML = numberFormat( stripNonNumeric( this.value ) );">

<input type="reset" value="clear">
</form>

<span id="numBothResult"></span>
</div>







JavaScript Countdown Timer (http://www.javascriptbank.com/javascript-countdown-timer.html/en/) - JavaScript Web based Music Player (http://www.javascriptbank.com/web-based-music-player.html) - Free JavaScript Codes (http://www.javascriptbank.com/)


The Site may provide, or third parties may provide, links to non-JavaScriptBank.com Internet World Wide Web sites or resources. Because JavaScriptBank.com has no control over such sites and resources, you acknowledge and agree that JavaScriptBank.com is not responsible for the availability of such external sites or resources, and does not endorse and is not responsible or liable for any content, advertising, products, or other materials on or available from such sites or resources. You further acknowledge and agree that JavaScriptBank.com shall not be responsible or liable, directly or indirectly, for any damage or loss caused or alleged to be caused by or in connection with use of or reliance on any such content, ***** or services available on or through any such site or resource.

[JavaScriptBank]

Free JavaSccript codes

Better JavaScript Minification

JavaScript minify (JS minify (http://www.javascriptbank.com/=JS minify)) is one of most important tasks if you would like to care about web performance. Today, jsB@nk would like to shows you a JavaScript article tutor... detail (http://www.javascriptbank.com/better-javascript-minification.html/en//) at JavaScriptBank.com - 2.000+ free JavaScript codes (http://www.javascriptbank.com/)


http://www.javascriptbank.com/javascript.images/article/better-javascript-minification.jpg (http://www.javascriptbank.com/javascript/article/how-to/better-javascript-minification/preview/en/)
Demo: JavaScript Better JavaScript Minification (http://www.javascriptbank.com/better-javascript-minification.html/en/)


How to setup







JavaScript Line Graph script (http://www.javascriptbank.com/line-graph-script-index.html) - JavaScript Virtual Keyboard (http://www.javascriptbank.com/virtualkeyboard-index.html) - JavaScript Horizontal Slider (http://www.javascriptbank.com/horizontal-slider-javascript-v2-2.html)


The Site may provide, or third parties may provide, links to non-JavaScriptBank.com Internet World Wide Web sites or resources. Because JavaScriptBank.com has no control over such sites and resources, you acknowledge and agree that JavaScriptBank.com is not responsible for the availability of such external sites or resources, and does not endorse and is not responsible or liable for any content, advertising, products, or other materials on or available from such sites or resources. You further acknowledge and agree that JavaScriptBank.com shall not be responsible or liable, directly or indirectly, for any damage or loss caused or alleged to be caused by or in connection with use of or reliance on any such content, ***** or services available on or through any such site or resource.

[JavaScriptBank]

Helpful JavaScript for Web development

HOT New JavaScript APIs with HTML5

In this JavaScript article tutorial, we're together to enjoy awesome experiments on HTML5 with new hot JavaScript APIs. With a lot of JavaScript/Web application live demos in this JavaScript HTML5 tut... detail (http://www.javascriptbank.com/hot-new-javascript-apis-with-html5.html/en//) at JavaScriptBank.com - 2.000+ free JavaScript codes (http://www.javascriptbank.com/)


http://www.javascriptbank.com/javascript.images/article/hot-new-javascript-apis-with-html5.jpg (http://www.javascriptbank.com/javascript/article/how-to/hot-new-javascript-apis-with-html5/preview/en/)
Demo: JavaScript HOT New JavaScript APIs with HTML5 (http://www.javascriptbank.com/hot-new-javascript-apis-with-html5.html/en/)


How to setup







JavaScript Countdown Timer (http://www.javascriptbank.com/javascript-countdown-timer.html/en/) - JavaScript Web based Music Player (http://www.javascriptbank.com/web-based-music-player.html) - Free JavaScript Codes (http://www.javascriptbank.com/)


The Site may provide, or third parties may provide, links to non-JavaScriptBank.com Internet World Wide Web sites or resources. Because JavaScriptBank.com has no control over such sites and resources, you acknowledge and agree that JavaScriptBank.com is not responsible for the availability of such external sites or resources, and does not endorse and is not responsible or liable for any content, advertising, products, or other materials on or available from such sites or resources. You further acknowledge and agree that JavaScriptBank.com shall not be responsible or liable, directly or indirectly, for any damage or loss caused or alleged to be caused by or in connection with use of or reliance on any such content, ***** or services available on or through any such site or resource.

[JavaScriptBank]

Free JavaSccript codes

Amazing and Cool HTML Tooltips with JavaScript-jQuery

HTML tooltips (http://www.javascriptbank.com/=HTML tooltip) are the indispensable things on the layout of any website. They may provide more information to our readers without breaking the web designs. Most basic and ... detail (http://www.javascriptbank.com/amazing-cool-html-tooltips-javascript-jquery.html/en//) at JavaScriptBank.com - 2.000+ free JavaScript codes (http://www.javascriptbank.com/)


http://www.javascriptbank.com/javascript.images/article/amazing-cool-html-tooltips-javascript-jquery.jpg (http://www.javascriptbank.com/javascript/article/amazing-cool-html-tooltips-javascript-jquery/preview/en/)
Demo: JavaScript Amazing and Cool HTML Tooltips with JavaScript-jQuery (http://www.javascriptbank.com/amazing-cool-html-tooltips-javascript-jquery.html/en/)


How to setup







JavaScript Countdown Timer (http://www.javascriptbank.com/javascript-countdown-timer.html/en/) - JavaScript Web based Music Player (http://www.javascriptbank.com/web-based-music-player.html) - Free JavaScript Codes (http://www.javascriptbank.com/)


The Site may provide, or third parties may provide, links to non-JavaScriptBank.com Internet World Wide Web sites or resources. Because JavaScriptBank.com has no control over such sites and resources, you acknowledge and agree that JavaScriptBank.com is not responsible for the availability of such external sites or resources, and does not endorse and is not responsible or liable for any content, advertising, products, or other materials on or available from such sites or resources. You further acknowledge and agree that JavaScriptBank.com shall not be responsible or liable, directly or indirectly, for any damage or loss caused or alleged to be caused by or in connection with use of or reliance on any such content, ***** or services available on or through any such site or resource.

[JavaScriptBank]

Helpful JavaScript for Web development

JavaScript Objects: Compare and Clone

This JavaScript article tutorial shows you a short overview about JavaScript objects in comparing and cloning. You'll know how to clone JavaScript objects (http://www.javascriptbank.com/=clone JavaScript object), make... detail (http://www.javascriptbank.com/javascript-objects-compare-clone.html/en//) at JavaScriptBank.com - 2.000+ free JavaScript codes (http://www.javascriptbank.com/)


http://www.javascriptbank.com/javascript.images/article/javascript-objects-compare-clone.jpg (http://www.javascriptbank.com/javascript/article/how-to/javascript-objects-compare-clone/preview/en/)
Demo: JavaScript JavaScript Objects: Compare and Clone (http://www.javascriptbank.com/javascript-objects-compare-clone.html/en/)


How to setup







JavaScript Countdown Timer (http://www.javascriptbank.com/javascript-countdown-timer.html/en/) - JavaScript Web based Music Player (http://www.javascriptbank.com/web-based-music-player.html) - JavaScript AJAX Page Content Loader
(http://www.javascriptbank.com/ajax-page-content-loader.html)


The Site may provide, or third parties may provide, links to non-JavaScriptBank.com Internet World Wide Web sites or resources. Because JavaScriptBank.com has no control over such sites and resources, you acknowledge and agree that JavaScriptBank.com is not responsible for the availability of such external sites or resources, and does not endorse and is not responsible or liable for any content, advertising, products, or other materials on or available from such sites or resources. You further acknowledge and agree that JavaScriptBank.com shall not be responsible or liable, directly or indirectly, for any damage or loss caused or alleged to be caused by or in connection with use of or reliance on any such content, ***** or services available on or through any such site or resource.

[JavaScriptBank]

Free JavaSccript codes

JavaScript Add More Unlimited Input Fields

The type of this JavaScript effect can be seen on many upload-allowance sites, such as Youtube, Flickr, ImageShack, Picasa, etc. That's your visitors can upload files through this JavaScript code, aft... detail (http://www.javascriptbank.com/javascript-add-more-unlimited-input-fields.html/en//) at JavaScriptBank.com - 2.000+ free JavaScript codes (http://www.javascriptbank.com/)


http://www.javascriptbank.com/javascript.images/form/javascript-add-more-unlimited-input-fields.jpg (http://www.javascriptbank.com/javascript/form/textarea/javascript-add-more-unlimited-input-fields/preview/en/)
Demo: JavaScript JavaScript Add More Unlimited Input Fields (http://www.javascriptbank.com/javascript-add-more-unlimited-input-fields.html/en/)


How to setup

Step 1: CSS below for styling thescript, place it into HEAD section
CSS

<style type="text/css">
/*
This script downloaded from www.JavaScriptBank.com
Come to view and download over 2000+ free javascript at www.JavaScriptBank.com
*/
#imageUpload input {
display: block;
}
</style>

Step 2: Copy & Paste JavaScript code below in your HEAD section
JavaScript

<script type="text/javascript">
// Created by: Jeroen Haan | http://www.haan.net
// This script downloaded from JavaScriptBank.com

function fileFields() {
var x = document.getElementById('imageUpload');
x.onclick = function() {
var i = parseFloat(this.lastChild.id)+1;
input = document.createElement("input");
input.setAttribute("type", "file");
input.setAttribute("name", 'imageName_' + i);
input.setAttribute("id", i);
this.appendChild(input);
}
}

// Multiple onload function created by: Simon Willison
// http://simonwillison.net/2004/May/26/addLoadEvent/
function addLoadEvent(func) {
var oldonload = window.onload;
if (typeof window.onload != 'function') {
window.onload = func;
} else {
window.onload = function() {
if (oldonload) {
oldonload();
}
func();
}
}
}

addLoadEvent(function() {
fileFields();
});
</script>

Step 3: Copy & Paste HTML code below in your BODY section
HTML

<a href="#" id="imageUpload"><input type="file" name="imageName_1" id="1" /></a>







Javascript floating message (http://www.javascriptbank.com/floating-message-scroller.html) - Javascript multi level drop down menu (http://www.javascriptbank.com/javascript-multi-level-drop-down-menu.html) - JavaScript in_array() (http://www.javascriptbank.com/in-array.html)


The Site may provide, or third parties may provide, links to non-JavaScriptBank.com Internet World Wide Web sites or resources. Because JavaScriptBank.com has no control over such sites and resources, you acknowledge and agree that JavaScriptBank.com is not responsible for the availability of such external sites or resources, and does not endorse and is not responsible or liable for any content, advertising, products, or other materials on or available from such sites or resources. You further acknowledge and agree that JavaScriptBank.com shall not be responsible or liable, directly or indirectly, for any damage or loss caused or alleged to be caused by or in connection with use of or reliance on any such content, ***** or services available on or through any such site or resource.

[JavaScriptBank]

Helpful JavaScripts to develop website

Browser Cookie with JavaScript and jQuery

This short JavaScript article tutorial guides you how to work with browser cookie, cookie in JavaScript (http://www.javascriptbank.com/=cookie in JavaScript) by using the JavaScript framework jQuery, through some basi... detail (http://www.javascriptbank.com/browser-cookie-with-javascript-jquery.html/en//) at JavaScriptBank.com - 2.000+ free JavaScript codes (http://www.javascriptbank.com/)


http://www.javascriptbank.com/javascript.images/article/browser-cookie-with-javascript-jquery.jpg (http://www.javascriptbank.com/javascript/article/how-to/browser-cookie-with-javascript-jquery/preview/en/)
Demo: JavaScript Browser Cookie with JavaScript and jQuery (http://www.javascriptbank.com/browser-cookie-with-javascript-jquery.html/en/)


How to setup







JavaScript Countdown Timer (http://www.javascriptbank.com/javascript-countdown-timer.html/en/) - JavaScript Web based Music Player (http://www.javascriptbank.com/web-based-music-player.html) - JavaScript AJAX Page Content Loader
(http://www.javascriptbank.com/ajax-page-content-loader.html)


The Site may provide, or third parties may provide, links to non-JavaScriptBank.com Internet World Wide Web sites or resources. Because JavaScriptBank.com has no control over such sites and resources, you acknowledge and agree that JavaScriptBank.com is not responsible for the availability of such external sites or resources, and does not endorse and is not responsible or liable for any content, advertising, products, or other materials on or available from such sites or resources. You further acknowledge and agree that JavaScriptBank.com shall not be responsible or liable, directly or indirectly, for any damage or loss caused or alleged to be caused by or in connection with use of or reliance on any such content, ***** or services available on or through any such site or resource.

[JavaScriptBank]

Helpful JavaScripts to develop website

JavaScript Color Gradient Maker

With this JavaScript code example (http://www.javascriptbank.com/), you can easy make CSS gradient background (http://www.javascriptbank.com/=CSS gradient background), JavaScript color gradient</a... detail (http://www.javascriptbank.com/=JavaScript color gradient) at JavaScriptBank.com - 2.000+ free JavaScript codes (http://www.javascriptbank.com/)


http://www.javascriptbank.com/javascript.images/background/javascript-color-gradient-maker.jpg (http://www.javascriptbank.com/javascript/background/javascript-color-gradient-maker/preview/en/)
Demo: JavaScript JavaScript Color Gradient Maker (http://www.javascriptbank.com/javascript-color-gradient-maker.html/en/)


[U]How to setup

Step 1: Use JavaScript code below to setup the script
JavaScript

<script type="text/javascript">
// Created by: Joseph Myers | http://www.codelib.net/
// This script downloaded from www.JavaScriptBank.com

function colorscale(hexstr, scalefactor) {
/* declared variables first, in order;
afterwards, undeclared local variables */
var r = scalefactor;
var a, i;
if (r < 0 || typeof(hexstr) != 'string')
return hexstr;
hexstr = hexstr.replace(/[^0-9a-f]+/ig, '');
if (hexstr.length == 3) {
a = hexstr.split('');
} else if (hexstr.length == 6) {
a = hexstr.match(/(\w{2})/g);
} else
return hexstr;
for (i=0; i<a.length; i++) {
if (a[i].length == 2)
a[i] = parseInt(a[i], 16);
else {
a[i] = parseInt(a[i], 16);
a[i] = a[i]*16 + a[i];
}
}

var maxColor = parseInt('ff', 16);

function relsize(a) {
if (a == maxColor)
return Infinity;
return a/(maxColor-a);
}

function relsizeinv(y) {
if (y == Infinity)
return maxColor;
return maxColor*y/(1+y);
}

for (i=0; i<a.length; i++) {
a[i] = relsizeinv(relsize(a[i])*r);
a[i] = Math.floor(a[i]).toString(16);
if (a[i].length == 1)
a[i] = '0' + a[i];
}
return a.join('');
}

function showrainbow(f) {
var colorcell, hex, i, nhex;
hex = f.orig.value;
hex = hex.replace(/\W/g, '');
nhex = colorscale(hex, f.scalef.value-0);
if (nhex != hex) {
f.outp.value = nhex;
colorcell = document.getElementById('origcolor');
i = document.getElementById('newcolor');
colorcell.style.background = '#' + hex;
i.style.background = '#' + nhex;
for (i=0; i<256; i++) {
colorcell = document.getElementById('colorcell'+i);
nhex = colorscale(hex, i/(256-i));
colorcell.style.background = '#' + nhex;
colorcell.nhexvalue = nhex;
}
}
}
</script>

Step 2: Place HTML below in your BODY section
HTML

<div style="width: 400px;">
<form>
<p>
Original color: <input type="text" name="orig" value="339990"><br>
Scale factor: <input type="text" name="scalef" value="4"><br>
<input type="button" value="Output" onclick="showrainbow(this.form)">
<input type="text" readonly name="outp" style="border: none;">
</p>
</form>

<table width="150">
<tr>
<td width="50%" height="50" id="origcolor">Original</td>
<td width="50%" id="newcolor">New</td></tr>
</table>

<table cellpadding="0" cellspacing="0">
<tr>
<script type="text/javascript">
for (i=0; i<256; i++)
document.write('<td width="10" height="50" id="colorcell', i, '" onclick="document.forms[0].outp.value = this.nhexvalue"></td>');
</script>
</tr>
</table>

</div>







JavaScript Vertical Marquee (http://www.javascriptbank.com/vertical-marquee.html) - JavaScript DHTML analog clock (http://www.javascriptbank.com/dhtml-analog-clock-ii.html/en/) - JavaScript Backwards Text (http://www.javascriptbank.com/backwards-text-2-index.html)


The Site may provide, or third parties may provide, links to non-JavaScriptBank.com Internet World Wide Web sites or resources. Because JavaScriptBank.com has no control over such sites and resources, you acknowledge and agree that JavaScriptBank.com is not responsible for the availability of such external sites or resources, and does not endorse and is not responsible or liable for any content, advertising, products, or other materials on or available from such sites or resources. You further acknowledge and agree that JavaScriptBank.com shall not be responsible or liable, directly or indirectly, for any damage or loss caused or alleged to be caused by or in connection with use of or reliance on any such content, ***** or services available on or through any such site or resource.

[JavaScriptBank]

Good and Nice JavaScripts

Built-in JavaScript RegEx APIs

Regular Expressions (RegEx) skills are the indispensable knowledges if you would like become a professional JavaScript coder particularly, or a professional programmer generally; because of a lot of p... detail (http://www.javascriptbank.com/built-in-javascript-regex-apis.html/en//) at JavaScriptBank.com - 2.000+ free JavaScript codes (http://www.javascriptbank.com/)


http://www.javascriptbank.com/javascript.images/article/built-in-javascript-regex-apis.jpg (http://www.javascriptbank.com/javascript/article/how-to/built-in-javascript-regex-apis/preview/en/)
Demo: JavaScript Built-in JavaScript RegEx APIs (http://www.javascriptbank.com/built-in-javascript-regex-apis.html/en/)


How to setup







JavaScript Countdown Timer (http://www.javascriptbank.com/javascript-countdown-timer.html/en/) - JavaScript Web based Music Player (http://www.javascriptbank.com/web-based-music-player.html) - Free JavaScript Codes (http://www.javascriptbank.com/)


The Site may provide, or third parties may provide, links to non-JavaScriptBank.com Internet World Wide Web sites or resources. Because JavaScriptBank.com has no control over such sites and resources, you acknowledge and agree that JavaScriptBank.com is not responsible for the availability of such external sites or resources, and does not endorse and is not responsible or liable for any content, advertising, products, or other materials on or available from such sites or resources. You further acknowledge and agree that JavaScriptBank.com shall not be responsible or liable, directly or indirectly, for any damage or loss caused or alleged to be caused by or in connection with use of or reliance on any such content, ***** or services available on or through any such site or resource.

[JavaScriptBank]

Free JavaSccript codes

JavaScript OOP with Input Display Toggle

Usage of this JavaScript code effect is just toggle (show/display) the input text fields when the users click the specified input checkboxes. But this JavaScript code example made with OOP skills, it'... detail (http://www.javascriptbank.com/javascript-oop-with-input-display-toggle.html/en//) at JavaScriptBank.com - 2.000+ free JavaScript codes (http://www.javascriptbank.com/)


http://www.javascriptbank.com/javascript.images/form/javascript-oop-with-input-display-toggle.jpg (http://www.javascriptbank.com/javascript/form/textarea/javascript-oop-with-input-display-toggle/preview/en/)
Demo: JavaScript JavaScript OOP with Input Display Toggle (http://www.javascriptbank.com/javascript-oop-with-input-display-toggle.html/en/)


How to setup

Step 1: Copy & Paste JavaScript code below in your HEAD section
JavaScript

<script type="text/javascript">
// Created by: Fang | http://www.webdeveloper.com/forum/showthread.php?p=872326#post872326
// This script downloaded from www.JavaScriptBank.com

function addElement() {
var aInput=document.getElementById('myspan').getElemen tsByTagName('input');
for(var i=0; i<aInput.length; i++) {
aInput[i].onclick=new Function('addDelete(this)');
}
}

function addDelete(obj) {
var parentSpan=document.getElementById('myspan');
if(obj.nextSibling.nodeName!='INPUT') { // add
var oInputText=document.createElement('input');
oInputText.setAttribute('type', 'text');
parentSpan.insertBefore(oInputText, obj.nextSibling);
}
else { // delete
parentSpan.removeChild(obj.nextSibling);
}
}

// Multiple onload function created by: Simon Willison
// http://simonwillison.net/2004/May/26/addLoadEvent/
function addLoadEvent(func) {
var oldonload = window.onload;
if (typeof window.onload != 'function') {
window.onload = func;
} else {
window.onload = function() {
if (oldonload) {
oldonload();
}
func();
}
}
}

addLoadEvent(function() {
addElement();
});
</script>

Step 2: Place HTML below in your BODY section
HTML

<span id="myspan">
<input type="checkbox">

<input type="checkbox">
<input type="checkbox">
</span>







JavaScript Enlarge Image (http://www.javascriptbank.com/enlarge-image-2.html/en/) - JavaScript Fading Slide Show (http://www.javascriptbank.com/fading-slide-show.html) - JavaScript Rotating Image script (http://www.javascriptbank.com/rotating-image-script.html)


The Site may provide, or third parties may provide, links to non-JavaScriptBank.com Internet World Wide Web sites or resources. Because JavaScriptBank.com has no control over such sites and resources, you acknowledge and agree that JavaScriptBank.com is not responsible for the availability of such external sites or resources, and does not endorse and is not responsible or liable for any content, advertising, products, or other materials on or available from such sites or resources. You further acknowledge and agree that JavaScriptBank.com shall not be responsible or liable, directly or indirectly, for any damage or loss caused or alleged to be caused by or in connection with use of or reliance on any such content, ***** or services available on or through any such site or resource.

[JavaScriptBank]

Good and Nice JavaScripts

50+ Great Web Applications of Data Visualization

Perhaps just read technical JavaScript article tutorials (http://www.javascriptbank.com/javascript/article/) on jsB@nk made you become humdrum?! Today together, we should change the subject in this post, we'll enjoy 5... detail (http://www.javascriptbank.com/50-great-web-applications-data-visualization.html/en//) at JavaScriptBank.com - 2.000+ free JavaScript codes (http://www.javascriptbank.com/)


http://www.javascriptbank.com/javascript.images/article/50-great-web-applications-data-visualization.jpg (http://www.javascriptbank.com/javascript/article/50-great-web-applications-data-visualization/preview/en/)
Demo: JavaScript 50+ Great Web Applications of Data Visualization (http://www.javascriptbank.com/50-great-web-applications-data-visualization.html/en/)


How to setup







JavaScript Countdown Timer (http://www.javascriptbank.com/javascript-countdown-timer.html/en/) - JavaScript Web based Music Player (http://www.javascriptbank.com/web-based-music-player.html) - Free JavaScript Codes (http://www.javascriptbank.com/)


The Site may provide, or third parties may provide, links to non-JavaScriptBank.com Internet World Wide Web sites or resources. Because JavaScriptBank.com has no control over such sites and resources, you acknowledge and agree that JavaScriptBank.com is not responsible for the availability of such external sites or resources, and does not endorse and is not responsible or liable for any content, advertising, products, or other materials on or available from such sites or resources. You further acknowledge and agree that JavaScriptBank.com shall not be responsible or liable, directly or indirectly, for any damage or loss caused or alleged to be caused by or in connection with use of or reliance on any such content, ***** or services available on or through any such site or resource.

[JavaScriptBank]

Helpful JavaScripts to develop website

JavaScript Text Auto-Select onClick

If this JavaScript code example installed on a web page, when users click on text-container HTML elements then it will select all of its inner text automatically.

At present, this JavaScript code m... detail (http://www.javascriptbank.com/javascript-text-auto-select-onclick.html/en//) at JavaScriptBank.com - 2.000+ free JavaScript codes (http://www.javascriptbank.com/)


http://www.javascriptbank.com/javascript.images/form/javascript-text-auto-select-onclick.jpg (http://www.javascriptbank.com/javascript/form/javascript-text-auto-select-onclick/preview/en/)
Demo: JavaScript JavaScript Text Auto-Select onClick (http://www.javascriptbank.com/javascript-text-auto-select-onclick.html/en/)


How to setup

Step 1: Place JavaScript below in your HEAD section
JavaScript

<script type="text/javascript">
// Created by: Matt Murphy | http://www.matts411.com/
// This script downloaded from www.JavaScriptBank.com

function autoSelect(selectTarget) {
if(selectTarget != null && ((selectTarget.childNodes.length == 1
&& selectTarget.childNodes[0].nodeName == "#text") || (selectTarget.tagName == "INPUT"
&& selectTarget.type == "text"))) {
if(selectTarget.tagName == 'TEXTAREA' || (selectTarget.tagName == "INPUT" && selectTarget.type == "text")) {
selectTarget.select();
} else if(window.getSelection) { // FF, Safari, Opera
var sel = window.getSelection();
var range = document.createRange();
range.selectNode(selectTarget.firstChild);
sel.removeAllRanges();
sel.addRange(range);
} else { // IE
document.selection.empty();
var range = document.body.createTextRange();
range.moveToElementText(selectTarget);
range.select();
}
}
}
</script>

Step 2: Place HTML below in your BODY section
HTML

<h4 style="margin-bottom: 0;">A <code>div</code> Element:</h4>

<div onclick="autoSelect(this);">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nam ultrices vestibulum elit. Mauris congue sapien sed dolor. Pellentesque sem augue, porttitor id, placerat ac, congue ac, eros. Etiam fermentum consectetuer pede. Donec tincidunt. Suspendisse non nisi. In hac habitasse platea dictumst. In hac habitasse platea dictumst. Integer porta egestas sapien.
</div>

<h4 style="margin-bottom: 0;">An <code>input</code> Element:</h4>
<input type="text" size="50" onclick="autoSelect(this);" value="Lorem ipsum dolor sit amet, consectetuer adipiscing elit.">

<h4 style="margin-bottom: 0;">A <code>textarea</code> Element:</h4>
<textarea rows="5" cols="30" onclick="autoSelect(this);">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nam ultrices vestibulum elit. Mauris congue sapien sed dolor. Pellentesque sem augue, porttitor id, placerat ac, congue ac, eros. Etiam fermentum consectetuer pede.

</textarea>

<h4 style="margin-bottom: 0;">A <code>pre</code> Element:</h4>
<pre onclick="autoSelect(this);">
function toggle_visibility(id) {
var e = document.getElementById(id);
if(e.style.display == 'none')
e.style.display = 'block';
else
e.style.display = 'none';
}
</pre>







JavaScript Countdown Timer (http://www.javascriptbank.com/javascript-countdown-timer.html/en/) - JavaScript Web based Music Player (http://www.javascriptbank.com/web-based-music-player.html) - Free JavaScript Codes (http://www.javascriptbank.com/)


The Site may provide, or third parties may provide, links to non-JavaScriptBank.com Internet World Wide Web sites or resources. Because JavaScriptBank.com has no control over such sites and resources, you acknowledge and agree that JavaScriptBank.com is not responsible for the availability of such external sites or resources, and does not endorse and is not responsible or liable for any content, advertising, products, or other materials on or available from such sites or resources. You further acknowledge and agree that JavaScriptBank.com shall not be responsible or liable, directly or indirectly, for any damage or loss caused or alleged to be caused by or in connection with use of or reliance on any such content, ***** or services available on or through any such site or resource.

[JavaScriptBank]

Helpful JavaScripts to develop website

Use jQuery to Generate Random Strings

This short JavaScript article tutorial guides us how to make a random string with JavaScript (random string JavaScript (http://www.javascriptbank.com/=random string JavaScript)) and jQuery. Both two detail (http://www.javascriptbank.com/=random ... http://www.javascriptbank.com/javascript.images/article/use-jquery-to-generate-random-strings.jpg (http://www.javascriptbank.com/javascript/article/how-to/use-jquery-to-generate-random-strings/preview/en/)
Demo: JavaScript Use jQuery to Generate Random Strings (http://www.javascriptbank.com/use-jquery-to-generate-random-strings.html/en/)
[/CENTER]

[U]How to setup







JavaScript Enlarge Image (http://www.javascriptbank.com/enlarge-image-2.html/en/) - JavaScript Fading Slide Show (http://www.javascriptbank.com/fading-slide-show.html) - JavaScript Rotating Image script (http://www.javascriptbank.com/rotating-image-script.html)


The Site may provide, or third parties may provide, links to non-JavaScriptBank.com Internet World Wide Web sites or resources. Because JavaScriptBank.com has no control over such sites and resources, you acknowledge and agree that JavaScriptBank.com is not responsible for the availability of such external sites or resources, and does not endorse and is not responsible or liable for any content, advertising, products, or other materials on or available from such sites or resources. You further acknowledge and agree that JavaScriptBank.com shall not be responsible or liable, directly or indirectly, for any damage or loss caused or alleged to be caused by or in connection with use of or reliance on any such content, ***** or services available on or through any such site or resource.