Computer Forums

Computer Forums (http://www.geekboards.com/forums/index.php)
-   Building Websites (http://www.geekboards.com/forums/forumdisplay.php?f=3)
-   -   JavaScript codes for Web DEV (http://www.geekboards.com/forums/showthread.php?t=15045)

JavaScriptBank 02-15-2011 09:39 PM

JavaScript Filename Array Maker
 
During coding JavaScript applications, we usually have to work with many JavaScript arrays; and sometimes declare/initiate them is the time-consuming tasks.

For this reason, I would like to present... 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">
#display {
  position: relative;
  left: 10px;
  width: 450px;
  border: 1px solid black;
  padding: 10px;
}
</style>

Step 2: Use JavaScript code below to setup the script
JavaScript
Code:

<script type="text/javascript">
// Created by: Mr. J | http://www.huntingground.net/
// This script downloaded from www.JavaScriptBank.com

function init(){
  array_name=document.f1.t1.value //name of array
  val2=document.f1.t3a.value
  ext=document.f1.t4.value
  for(r=0;r<document.f1.r1.length;r++){ // check which r1 radio is selected
    if(document.f1.r1[r].checked==true){
      option=document.f1.r1[r].value // selected radio value
    }
  }

  if(option==0){
    document.getElementById("display").innerHTML=array_name+" = new Array(" // opening array type 1
  } else {
    document.getElementById("display").innerHTML=array_name+" = new Array()<br>" // opening array type 2 & 3
  }

  if(document.f1.r2[0].checked==true){ // if indexed values
    make_array1()
  }

  if(document.f1.r2[1].checked==true){ // if non index values
    make_array2()
  }
}

function make_array1(){
  array_length=document.f1.t2.value-1 // length of array
  index_values=document.f1.t3.value // index value

  if(array_length==""||array_length==0){ // make sure a viable number is used
    document.getElementById("display").innerHTML="Please Enter a Number"
    document.f1.b2.disabled=true
    return
  } else {
    if(!ns){document.f1.cpy.disabled=false}
  }

  for(num=0;num<array_length;num++){
    j=num
    if(num<10){num="00"+num}
    if(num>9&&num<100){num="0"+num}
    if(document.f1.t4.value.length>0){
      i=num+val2+ext}
      else{i=num+val2}

  if(option==0){ // insert inner indexes for type 1
    document.getElementById("display").innerHTML+="\""+index_values+i+"\", "
  } else {
    if(option==1){ // insert inner indexes for type 2
      document.getElementById("display").innerHTML+=array_name+"["+j+"]="
      document.getElementById("display").innerHTML+="\""+index_values+i+"\"<br>"
    } else { // insert inner indexes for type 3
      document.getElementById("display").innerHTML+=array_name+"["+array_name+".length]=\""+index_values+i+"\"<br>"
    }
  }
}

if(num<10){num="00"+num}
if(num>9&&num<100){num="0"+num}
if(num>100){num=num}

if(document.f1.t4.value.length>0){
  i= num+val2+ext}
  else{i=num+val2}

  if(option==0){ // insert last indexes for type 1
    document.getElementById("display").innerHTML+="\""+index_values+i+"\")"
  } else {
    if(option==1){ // insert last indexes for type 2
      document.getElementById("display").innerHTML+=array_name+"["+(j+1)+"]="
      document.getElementById("display").innerHTML+="\""+index_values+i+"\"<br>"
    } else { // insert last indexes for type 3
      document.getElementById("display").innerHTML+=array_name+"["+array_name+".length]=\""+index_values+i+"\"<br>"
    }
  }
}

index_value=new Array()
count= 0
last=0

function make_array2(){
  if(!ns){document.f1.cpy.disabled=false}
  for(r=0;r<document.f1.r1.length;r++){ // check which r1 radio is selected
    if(document.f1.r1[r].checked==true){
      chkrad=r
    }
  }
  if(chkrad!=last){ // prevent additional index when only changing array style
    count--
  }

  if(document.f1.t4.value.length>0){
    index_value[count]=document.f1.t3.value+ext}
  else {
    index_value[count]=document.f1.t3.value
  }

  for(i=0;i<count;i++){
    if(option==0){
      document.getElementById("display").innerHTML+="\""+index_value[i]+"\", "
    } else {
      if(option==2){
        document.getElementById("display").innerHTML+=array_name+"["+array_name+".length]=\""+index_value[i]+"\"<br>"
      } else {
        document.getElementById("display").innerHTML+=array_name+"["+i+"]=\""+index_value[i]+"\"<br>"
      }
    }
  }

  if(option==0){
    document.getElementById("display").innerHTML+="\""+index_value[i]+"\")"
  } else {
    if(option==2){
      document.getElementById("display").innerHTML+=array_name+"["+array_name+".length]=\""+index_value[i]+"\"<br>"
    } else {
      document.getElementById("display").innerHTML+=array_name+"["+i+"]=\""+index_value[i]+"\"<br>"
    }
  }
  count++
  document.f1.t3.select()
  last=chkrad
}

function oreset(){
  count=0
  document.f1.t3.value=""
  document.getElementById("display").innerHTML=""
  document.f1.t3.select()
}

function chk(){
  if(document.f1.r2[0].checked==true){
    document.f1.t2.disabled=false
    document.getElementById("sp").disabled=false
    document.f1.t2.style.backgroundColor="#FFFFFF"
    document.f1.b1.disabled=false
    document.f1.b2.disabled=true
    document.f1.b3.disabled=true
    document.f1.t3a.disabled=false
    document.f1.t3a.style.backgroundColor="#FFFFFF"
  } else {
    document.f1.t2.disabled=true
    document.getElementById("sp").disabled=true
    document.f1.t2.style.backgroundColor="#c0c0c0"
    document.f1.b1.disabled=true
    document.f1.b2.disabled=false
    document.f1.b3.disabled=false
    document.f1.t3.select()
    document.f1.t3a.disabled=true
    document.f1.t3a.style.backgroundColor="#c0c0c0"
  }
}

function Copy(id){
  if(ns){
    alert("Sorry, Netscape does not recongise this function")
    document.f1.cpy.disabled=true
    return
  }
  copyit=id
  textRange = document.body.createTextRange();
  textRange.moveToElementText(copyit);
  textRange.execCommand("Copy");
  alert("Copying Complete.\n\nPlease Paste into your SCRIPT")
}

ns=document.getElementById&&!document.all

function getKey(e) {
  pressed_key=(!ns)?event.keyCode:e.which
  if( pressed_key==13){
    init()
  }
}
document.onkeypress = getKey;
</script>

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

<!--
/*
    This script downloaded from www.JavaScriptBank.com
    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com
*/
-->
<form name="f1">

<table border="0">
  <tr>
    <td>Array Name:</td>
    <td colspan="6">
      <input type="text" name="t1" value="myArray">
    </td>
  </tr><tr>
    <td>

      <span id="sp">Indexed Array Length:</span>
    </td>
    <td colspan="6">
      <input type="text" name="t2" value="5" size="3" maxlength="3">
    </td>
  </tr><tr>
    <td>Index Value:</td>
    <td colspan="6">

      <input type="text" name="t3" value="image" size="10">
      <input type="text" name="t3a" value="_tn" size="10"> Ext
      <input type="text" name="t4" value=".jpg" size="4" maxlength="4">
    </td>
  </tr><tr>
    <td>Index Style:</td>
    <td align="right">1
      <input type="radio" name="r1" value="0" checked onclick="init()">
    </td>

    <td> </td>
    <td align="right">2
      <input type="radio" name="r1" value="1" onclick="init()">
    </td>
    <td> </td>
    <td align="right">3
      <input type="radio" name="r1" value="2" onclick="init()">
    </td>
    <td width="80"> </td>

  </tr><tr>
    <td>Add Numerical Values:</td>
    <td align="right">Yes
      <input type="radio" name="r2" value="0" checked onclick="chk()">
    </td>
    <td align="center"> </td>
    <td align="right">No
      <input type="radio" name="r2" value="1" onclick="chk()">
    </td>

    <td> </td>
    <td colspan="2"> </td>
  </tr><tr align="center">
    <td>
      <input type="button" name="b1" value="Numerical Enter" onclick="init()">
    </td>
    <td colspan="6">
      <input type="button" name="cpy" value="Copy Array" onclick="Copy(display)" disabled>

      <input type="button" name="b2" value="Manual Enter" onclick="init()" disabled>
      <input type="button" name="b3" value="Restart" onclick="oreset()" disabled>
    </td>
  </tr>
</table>

</form>

<div id="display"></div>







movie 02-21-2011 07:31 PM

very interesting solution you have found

JavaScriptBank 02-23-2011 09:01 PM

jQuery JavaScript Countdown Timer with Bar Display
 
This is really a cool JavaScript code example to display an amazing JavaScript countdown timer on your web pages. With the support of the powerful JavaScript framework - jQuery - you can set the point... 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" media="screen">
/*
    This script downloaded from www.JavaScriptBank.com
    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com
*/
  #seconds-box,#minutes-box,#hours-box,#days-box {
  width: 222px;
  height: 30px;
  background: #eee;
  border: 1px solid #ccc;
        }

  #seconds-outer,#minutes-outer,#hours-outer,#days-outer {
  margin: 10px;
  width: 200px;
  height: 9px;
  border: 1px solid #aaa;
  background: #f3f3f3;
  }
 
  #seconds-inner,#minutes-inner,#hours-inner,#days-inner {
  height: 100%;
  width: 100%;
  background: #c00;
  }

        #seconds-count,#minutes-count,#hours-count,#days-count {
            float: left;
            font-size: 0.9em;
            margin-left: -200px;
            margin-top: 7px;
         
        }

 </style>

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

<script type="text/javascript" src="/javascript/jquery.js"></script>
<script type="text/javascript">

/*
    This script downloaded from www.JavaScriptBank.com
    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com
*/
    function timeleft(timetype){
        days=0;hours=0;mins=0;
        var e = new Date(2010,11,25,0,0,0);
        var now  = new Date();
        var left = e.getTime() - now.getTime();

        left = Math.floor(left/1000);
  days = Math.floor(left/86400);
  left = left%86400;
  hours=Math.floor(left/3600);
  left=left%3600;
  mins=Math.floor(left/60);
  left=left%60;
  secs=Math.floor(left);

        switch(timetype){
            case "s":
                return secs;
                break;
            case "m":
                return mins;
                break;
            case "h":
                return hours;
                break;
            case "d":
                return days;
                break;
        }
    }

    function set_start_count(){
        set_hour_count();
        set_minute_count();
        set_day_count();
    }

    function set_day_count(){
        d=timeleft('d');
        $('#days-count').text(d.toString() + ' day(s)');
    }

    function set_hour_count(){
        h=timeleft('h');
        $('#hours-count').text(h.toString() + ' hour(s)');
    }

    function set_minute_count(){
        m = timeleft('m');
        $('#minutes-count').text(m.toString()+ ' minute(s)');
    }
    function set_second_count(){
        s = timeleft('s');
        $('#seconds-count').text(s.toString() + ' second(s)');
    }

    function update_minute(){
        var now = new Date();
        var mw = $('#minutes-outer').css('width');
        mw = mw.slice(0,-2);
        var s = now.getSeconds();
        sleft = (60 - s)
        if (sleft == 0)
        {
            sleft=60;
        }
        m = ((sleft/60)*mw).toFixed();
        $('#minutes-inner').css({width:m});
        return sleft*1000;
    }

    function update_hour(){
        var now = new Date();
        var mw = $('#hours-outer').css('width');
        mw = mw.slice(0,-2);
        var s = now.getMinutes();
        sleft = 60 - s
        m = ((sleft/60)*mw).toFixed();

        $('#hours-inner').css({width: m});
        return sleft*(1000*60);
    }

    function update_day(){

        var now = new Date();
        var mw = $('#days-outer').css('width');
        mw = mw.slice(0,-2);
        var s = now.getHours();
        sleft = 24 - s
        m = ((sleft/24)*mw).toFixed();

        $('#days-inner').css({width: m });
        return sleft*(1000*60*24);
    }

    function reset_day(){
        $('#days-inner').width($('#days-outer').width());
        start_countdown_day();
    }

    function reset_hour(){
        $('#hours-inner').width($('#hours-outer').width());
        start_countdown_hour();
    }

    function reset_second(){
        $('#seconds-inner').width($('#seconds-outer').width());
        start_countdown_second();
    }

    function reset_minute(){
        $('#minutes-inner').width($('#minutes-outer').width());
        start_countdown_minute();
    }

    function start_countdown_second(){
        set_second_count();
        now = new Date();
        $('#seconds-inner').animate({width: 0}, 1000,reset_second);
    }

    function start_countdown_minute(){
        set_minute_count();
        $('#minutes-inner').animate({width: 0}, update_minute(),reset_minute);
        //update_minute());
    }

    function start_countdown_hour(){
        set_hour_count();
        $('#hours-inner').animate({width: 0},update_hour(),reset_hour);
    }

    function start_countdown_day(){
        set_day_count();
        $('#days-inner').animate({width: 0},update_day(),reset_day);
    }

    $(document).ready( function(){
        start_countdown_second();
        start_countdown_minute();
        start_countdown_hour();
        start_countdown_day();
    });
</script>

Step 3: Place HTML below in your BODY section
HTML
Code:

<center>
 
 <div id="days-box">
    <div id="days-count"> </div>
    <div id="days-outer">
        <div id="days-inner"> </div>
    </div>
 </div>


 <div id="hours-box">
    <div id="hours-count"> </div>
    <div id="hours-outer">
        <div id="hours-inner"> </div>
    </div>
 </div>

 <div id="minutes-box">
    <div id="minutes-count"> </div>
    <div id="minutes-outer">
        <div id="minutes-inner"> </div>
    </div>
 </div>

<div id="seconds-box">
    <div id="seconds-count"> </div>
    <div id="seconds-outer">
        <div id="seconds-inner"> </div>
    </div>
 </div>

</center>

Step 4: downloads
Files
jquery.js







JavaScriptBank 02-23-2011 09:33 PM

JavaScript Dynamic Drop Down Values on Action
 
If your web pages have a huge list of options to show in the drop down menus (listed into categories), why don't you consider to use this JavaScri... detail at JavaScriptBank.com - 2.000+ free JavaScript codes


How to setup

Step 1: Place JavaScript below in your HEAD section
JavaScript
Code:

<script type="text/javascript">
// Created by: Sandeep Gangadharan | http://www.sivamdesign.com/scripts/
// This script downloaded from www.JavaScriptBank.com

function changer(link) {
  if (link=="") {
    return; }

//======================
// Edit this portion below. For each new state copy and paste
// the entire IF statement and change the name of the state and the cities.
// Make sure the spelling of the state is the same in the IF statement and in the link.

  if (link=="Arizona") {
    document.theForm.theState.value="Arizona";
    var theOptions=new Array (
      "Bisbee",
      "Deer Valley",
      "Flagstaff",
      "Mesa",
      "Phoenix"); }
  else if (link=="California") {
    document.theForm.theState.value="California";
    var theOptions=new Array (
      "Alameda",
      "Bakersfield",
      "Burbank",
      "Los Angeles"); }
  else if (link=="Florida") {
    document.theForm.theState.value="Florida";
    var theOptions=new Array (
      "Altamonte Springs",
      "Boca Raton",
      "Miami",
      "West Palm Beach"); }
  else if (link=="New York") {
    document.theForm.theState.value="New York";
    var theOptions=new Array (
      "Albany",
      "East Rockaway",
      "New York City"); }

// Do not edit anything below this line:
//======================

  i = document.theForm.secondChoice.options.length;
    if (i > 0) {
      document.theForm.secondChoice.options.length -= i; document.theForm.secondChoice.options[i] = null;
    }

  var theCount=0;
  for (e=0; e<theOptions.length; e++) {
    document.theForm.secondChoice.options[theCount] = new Option();
    document.theForm.secondChoice.options[theCount].text = theOptions[e];
    document.theForm.secondChoice.options[theCount].value = theOptions[e];
    theCount=theCount+1; }
}

//  NOTE: [document.theForm.theState.value] will get you the name of the state,
//  and [document.theForm.secondChoice.value] the name of the city chosen
</script>

Step 2: Place HTML below in your BODY section
HTML
Code:

<!--
/*
    This script downloaded from www.JavaScriptBank.com
    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com
*/
-->
<form name=theForm>
  <strong>Select a State:</strong><br>

  <a href="javascript:changer('Arizona')">Arizona</a> |
  <a href="javascript:changer('California')">California</a> |
  <a href="javascript:changer('Florida')">Florida</a> |
  <a href="javascript:changer('New York')">New York</a>
  <br><br>
  <strong>Then ...</strong><br>

  <input type="hidden" name="theState">
  <select name="secondChoice">
    <option value="">Select a City</option>
  </select>
</form>







JavaScriptBank 02-23-2011 10:20 PM

Build Simple Flash Timer Countdown in ActionScript
 
Countdown timer for an event seems to be an indispensable thing in the modern life of human, we can see them in the holidays of Christmas, new year, birthday, etc. Or easily, we can see them daily in ... detail at JavaScriptBank.com - 2.000+ free JavaScript codes


How to setup







JavaScriptBank 02-23-2011 10:59 PM

Simple JavaScript for Auto-Sum with Checkboxes
 
This JavaScript code example uses a for loop to calculate the sum of JavaScript checkbox values. This JavaScript will display a running total automatically wh... 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 type="text/javascript">
// Created by: Jay Rumsey | http://www.nova.edu/~rumsey/
// This script downloaded from JavaScriptBank.com

function UpdateCost() {
  var sum = 0;
  var gn, elem;
  for (i=0; i<5; i++) {
    gn = 'game'+i;
    elem = document.getElementById(gn);
    if (elem.checked == true) { sum += Number(elem.value); }
  }
  document.getElementById('totalcost').value = sum.toFixed(2);
}
</script>

Step 2: Place HTML below in your BODY section
HTML
Code:

<input type="checkbox" id='game0' value="9.99"  onclick="UpdateCost()">Game 1 ( 9.99)<br>
<input type="checkbox" id='game1' value="19.99" onclick="UpdateCost()">Game 2 (19.99)<br>
<input type="checkbox" id='game2' value="27.50" onclick="UpdateCost()">Game 3 (27.50)<br>
<input type="checkbox" id='game3' value="45.65" onclick="UpdateCost()">Game 4 (45.65)<br>
<input type="checkbox" id='game4' value="87.20" onclick="UpdateCost()">Game 5 (87.20)<br>







JavaScriptBank 03-10-2011 08:42 PM

Simple Auto Image Rotator with jQuery
 
This is a simple JavaScript code example to rotate your pictures continuously. This jQuery code example uses the blur effects for the animations of picture transitions. A very easy JavaScript code exa... 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">
/* rotator in-page placement */
    div#rotator {
        position:relative;
        height:345px;
        margin-left: 15px;
}
/* rotator css */
        div#rotator ul li {
        float:left;
        position:absolute;
        list-style: none;
}
/* rotator image style */       
        div#rotator ul li img {
        border:1px solid #ccc;
        padding: 4px;
        background: #FFF;
}
    div#rotator ul li.show {
        z-index:500
}
</style>

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

<script type="text/javascript" src="/javascript/jquery.js"></script>

<!-- By Dylan Wagstaff, http://www.alohatechsupport.net -->
<script type="text/javascript">

function theRotator() {
        //Set the opacity of all images to 0
        $('div#rotator ul li').css({opacity: 0.0});
       
        //Get the first image and display it (gets set to full opacity)
        $('div#rotator ul li:first').css({opacity: 1.0});
               
        //Call the rotator function to run the slideshow, 6000 = change to next image after 6 seconds
        setInterval('rotate()',6000);
       
}

function rotate() {       
        //Get the first image
        var current = ($('div#rotator ul li.show')?  $('div#rotator ul li.show') : $('div#rotator ul li:first'));

        //Get next image, when it reaches the end, rotate it back to the first image
        var next = ((current.next().length) ? ((current.next().hasClass('show')) ? $('div#rotator ul li:first') :current.next()) : $('div#rotator ul li:first'));       
       
        //Set the fade in effect for the next image, the show class has higher z-index
        next.css({opacity: 0.0})
        .addClass('show')
        .animate({opacity: 1.0}, 1000);

        //Hide the current image
        current.animate({opacity: 0.0}, 1000)
        .removeClass('show');
       
};

$(document).ready(function() {               
        //Load the slideshow
        theRotator();
});

</script>

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

<div id="rotator">
  <ul>
    <li class="show"><a href="http://www.alohatechsupport.net/webdesignmaui/"><img src="image-1.jpg" width="500" height="313"  alt="pic1" /></a></li>
    <li><a href="http://www.alohatechsupport.net/"><img src="image-2.jpg" width="500" height="313"  alt="pic2" /></a></li>
    <li><a href="http://www.alohatechsupport.net/mauiwebdesign.html"><img src="image-3.jpg" width="500" height="313"  alt="pic3" /></a></li>

    <li><a href="http://www.alohatechsupport.net/webdesignmaui/maui-web-site-design/easy_jquery_auto_image_rotator.html"><img src="image-4.jpg" width="500" height="313"  alt="pic4" /></a></li>
  </ul>
</div>

Step 4: must download files below
Files
jquery.js
image-1.jpg
image-2.jpg
image-3.jpg
image-4.jpg







JavaScriptBank 03-10-2011 09:19 PM

Awesome Canvas Drawer with HTML5
 
Although HTML5 is still developed but at present we still can enjoy many amazing web applications for HTML5, they're also presented on jsB@nk:

- detail at JavaScriptBank.com - 2.000+ free JavaScript codes


How to setup

Step 1: must download files below
Files
Awesome Canvas Drawer with HTML5.zip







JavaScriptBank 03-10-2011 09:59 PM

JavaScript RegEx Example Code for Text Input Limitations
 
One more JavaScript code example to limit user inputs with many options: non-alphanumeric characters with spaces, removes ex... 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">
// Created by: Ilya Gerasimenko | http://www.gerasimenko.com/
// This script downloaded from www.JavaScriptBank.com

// clean lines
cleanUpLine = function (str,limit) { // clean string
        var clean_pass1 = str.replace(/\W/g, ' ');        //replace punctuation with spaces
        var clean_pass2 = clean_pass1.replace(/\s{2,}/g, ' ');                // compact multiple whitespaces
        var clean_pass3 = clean_pass2.replace(/^\s+|\s+$/g, '');        // trim whitespaces from beginning or end of string
        var clean_pass4 = clean_pass3.substring(0,limit);                        // trim string
        return clean_pass4;
}

// number of keywords and keyword length validation
cleanUpList = function (fld) {
        var charLimit = 20;                // ADJUST: number of characters per line
        var lineLimit = 10;                // ADJUST: number of lines
        var cleanList = [];
        var re1 = /\S/;                        // all non-space characters
  var re2 = /[\n\r]/;                // all line breaks
        var tempList = fld.value.split('\n');
        for (var i=0; i<tempList.length;i++) {
                  if (re1.test(tempList[i])) { // store filtered lines in an array
                          var cleanS = cleanUpLine(tempList[i],charLimit);
                          cleanList.push(cleanS);
                  }
  }
  for (var j=0; j<tempList.length;j++) {
                  if (tempList[j].length > charLimit && !re2.test(tempList[j].charAt(charLimit))) { // make sure that last char is not a line break - for IE compatibility
                  fld.value = cleanList.join('\n'); // restore from array
                  }
        }
        if (cleanList.length > lineLimit) {
                  cleanList.pop();        // remove last line
                  fld.value = cleanList.join('\n'); // restore from array
        }
        fld.onblur = function () {this.value = cleanList.join('\n');} // onblur - restore from array
}       

// 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 () {
                  document.form.word_list.onkeyup =        function () {
                                  cleanUpList(document.form.word_list);
                  }
  }
);
</script>

Step 2: Place HTML below in your BODY section
HTML
Code:

Textarea below has limitations: 20 characters and 10 lines<br />
<form name="form">

        <textarea cols="22" rows="12" name="word_list" id="word_list"></textarea>
</form>







JavaScriptBank 03-22-2011 11:06 PM

Cool JavaScript Date Picker
 
A very simple JavaScript code example to create the amazing date pickers. This JavaScript date picker script will display pickers with the layout of calendar to allow users pick the date.

Within a ... detail at JavaScriptBank.com - 2.000+ free JavaScript codes


How to setup

Step 1: must download files below
Files
Cool JavaScript Date Picker.zip








All times are GMT -5. The time now is 08:03 AM.

Powered by vBulletin® Version 3.8.7
Copyright ©2000 - 2025, Jelsoft Enterprises Ltd.
HTML Help provided by HTML Help Central.