Go Back   Themers Club : Computers , Mobiles and Web Development Themes > Webmaster forum > Scripts and Tools

Scripts and Tools Share your free scripts , tools , icons, fontz, screen savers , etc here.

Reply
 
Thread Tools Display Modes
  #71  
Old 06-29-2010, 01:30 AM
JavaScriptBank JavaScriptBank is offline
Senior Member
 
Join Date: Jul 2009
Posts: 207
Rep Power: 18
JavaScriptBank is on a distinguished road
Default Countdown Timer 2

This countdown script prints directly to the page, displaying the [Only Registered users can see links . Click Here To Register...] left in minutes and seconds. The [Only Registered users can see links . Click Here To Register...] duration can be set in the ... [Only Registered users can see links . Click Here To Register...] at [Only Registered users can see links . Click Here To Register...]


How to setup

Step 1: Place CSS below in your HEAD section
CSS
Code:
<style>
.timeClass {
  font-family:arial,verdana,helvetica,sans-serif;
  font-weight:normal;
  font-size:10pt;
}
</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>
/*
	Created by: Sandeep Gangadharan 
	Web Site: http://www.sivamdesign.com/
*/

var sec = 30;   // set the seconds
var min = 02;   // set the minutes

function countDown() {
  sec--;
  if (sec == -01) {
    sec = 59;
    min = min - 1;
  } else {
   min = min;
  }
if (sec<=9) { sec = "0" + sec; }
  time = (min<=9 ? "0" + min : min) + " min and " + sec + " sec ";
if (document.getElementById) { theTime.innerHTML = time; }
  SD=window.setTimeout("countDown();", 1000);
if (min == '00' && sec == '00') { sec = "00"; window.clearTimeout(SD); }
}

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() {
  countDown();
});

</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:
<span id="theTime" class="timeClass"></span>
	<!--
    	This script downloaded from www.JavaScriptBank.com
    	Come to view and download over 2000+ free javascript at www.JavaScriptBank.com
	-->





Reply With Quote
  #72  
Old 07-02-2010, 01:29 AM
JavaScriptBank JavaScriptBank is offline
Senior Member
 
Join Date: Jul 2009
Posts: 207
Rep Power: 18
JavaScriptBank is on a distinguished road
Default JavaScript Word Clock: Spell the Time

This is most excellent JavaScript clock on the web page I ever see, although this is 5 minutes interval JavaScript clock but it has a very nice design and very unique performance: writing the time in ... [Only Registered users can see links . Click Here To Register...] at [Only Registered users can see links . Click Here To Register...]


How to setup

Step 1: Copy & Paste CSS code below in your HEAD section
CSS
Code:
<style>
        body {
            background-color: #111;
        }
        div#clock {
            font-size: 50px;
            font-family: monospace;
            color: #222;
            text-align: center;
        }
        
        .lightup {
            color: #EEE;
        }
        
        .seclightup {
            color: #EEE;
        }
        
        .gumuz {
            color: #333;
        }
    </style>
Step 2: Copy & Paste JavaScript code below in your HEAD section
JavaScript
Code:
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
    <script type="text/javascript">
        google.load("jquery", "1.3.2");     
        google.setOnLoadCallback(function() {
            function render_time(classes) {
                // reset
                $('span').removeClass('lightup');
                //toggle_sec();
                
                for (var i in classes) {
                    $(classes[i]).addClass('lightup');
                }
            }
            
            function toggle_sec() {                
                if ($('.sec').hasClass('seclightup')) {
                    $('.sec').removeClass('seclightup')
                } else {
                    $('.sec').addClass('seclightup')
                }
            }
            
            function check_time() {
                var classes = ['.it_is']
                
                toggle_sec();
                
                var date = new Date();
                var hours = date.getHours()%12;
                if (hours==0) hours = 12;
                var minutes = date.getMinutes()-(date.getMinutes()%5);
                if (date.getMinutes()%5 > 2) minutes = minutes + 5;
                if (minutes == 60) { minutes = 0; hours = hours+1;}
                
                // stupid switch logic...
                if (minutes == 0) {
                    // o'clock!
                    classes.push('.'+hours);
                    classes.push('.oclock');
                } else if (minutes == 30) {
                    // half past
                    classes.push('.'+hours);
                    classes.push('.half');
                    classes.push('.past');
                } else if (minutes == 15) {
                    // quarter past
                    classes.push('.'+hours);
                    classes.push('.past');
                    classes.push('.quarter');
                } else if (minutes == 45) {
                    // quarter to
                    if (hours==12) hours = 0;
                    classes.push('.'+(hours+1));
                    classes.push('.quarter');
                    classes.push('.to');
                } else if (minutes < 30) {
                    // X past
                    classes.push('.'+hours);
                    classes.push('.'+minutes+'to');
                    classes.push('.past');
                    classes.push('.minutes');
                } else if (minutes > 30) {
                    // X to
                    if (hours==12) hours = 0;
                    classes.push('.'+(hours+1));
                    classes.push('.'+(60-minutes)+'to');
                    classes.push('.to');
                    classes.push('.minutes');
                }
                
                render_time(classes);
                
            }
            
            setInterval(check_time, 1000);
      });
</script>
Step 3: Copy & Paste HTML code below in your BODY section
HTML
Code:
<div id="clock">
        <span class="it_is lightup">it</span>r<span class="it_is lightup">is</span>u<span class="half">half</span><span class="10to 10past">ten</span><br>
        <span class="quarter">quarter</span><span class="20to 25to lightup">twenty</span><br>

        <span class="25to 5to">five</span>q<span class="minutes lightup">minutes</span>t<br>
        <span class="past lightup">past</span>gumuz<span class="to">to</span>ne<br>
        <span class="1">one</span>n<span class="2">two</span>z<span class="3">three</span><br>

        <span class="4">four</span><span class="5">five</span><span class="7">seven</span><br>
        <span class="6">six</span><span class="8 lightup">eight</span>y<span class="9">nine</span><br>
        <span class="10">ten</span><span class="11">eleven</span><span class="sec">♥</span>sec<br>

        <span class="12">twelve</span><span class="oclock">o'clock</span><br>
    </div>





Reply With Quote
  #74  
Old 07-07-2010, 12:21 AM
JavaScriptBank JavaScriptBank is offline
Senior Member
 
Join Date: Jul 2009
Posts: 207
Rep Power: 18
JavaScriptBank is on a distinguished road
Default 5 Good and Small JavaScript Tips and Tricks

If you are a professional programmer or senior coder to one or many programming languages, certainly we will always have some little tips and tricks to solve the some problems better, and the web Java... [Only Registered users can see links . Click Here To Register...] at [Only Registered users can see links . Click Here To Register...]


How to setup






Reply With Quote
  #75  
Old 07-12-2010, 04:18 AM
JavaScriptBank JavaScriptBank is offline
Senior Member
 
Join Date: Jul 2009
Posts: 207
Rep Power: 18
JavaScriptBank is on a distinguished road
Default 30+ Super High Cool Sites with Amazing JavaScript effects

This JavaScript article shows you a list of 30 super high cool websites have great amazing JavaScript effects. These websites have an unique layout, along with a clever combination of awesome JavaScri... [Only Registered users can see links . Click Here To Register...] at [Only Registered users can see links . Click Here To Register...]


How to setup






Reply With Quote
  #76  
Old 07-14-2010, 12:28 AM
JavaScriptBank JavaScriptBank is offline
Senior Member
 
Join Date: Jul 2009
Posts: 207
Rep Power: 18
JavaScriptBank is on a distinguished road
Default JavaScript DHTML Dock Carousel Using Mootools

This is an awesome [Only Registered users can see links . Click Here To Register...] with an unique and eye-catching design, operated by the [Only Registered users can see links . Click Here To Register...], ... [Only Registered users can see links . Click Here To Register...] at [Only Registered users can see links . Click Here To Register...]


How to setup

Step 1: CSS below for styling thescript, place it into HEAD section
CSS
Code:
<link rel='stylesheet' href='slider.css' type='text/css' />
Step 2: Copy & Paste JavaScript code below in your HEAD section
JavaScript
Code:
<script src="mootools-12-core.js" type="text/javascript"></script>
<script src="mootools-12-more.js" type="text/javascript"></script>
<script src="dock.js" type="text/javascript"></script>
Step 3: Copy & Paste HTML code below in your BODY section
HTML
Code:
<div id="stage-container">
		<p class="text">
			<img src="text.gif" alt="image" width="111" height="24" />
		</p> <br clear="all"/>
		
		<a href="#" id="moveleft">Left</a>

		<a href="#" id="moveright">Right</a>
		
		<div id="wrapper">
			<ul id="items">

				<li><a><img class="icon" src="1.png" alt="image" width="32" height="32" /></a></li>
				<li><a><img class="icon" src="2.png" alt="image" width="32" height="32" /></a></li>
				<li><a><img class="icon" src="3.png" alt="image" width="32" height="32" /></a></li>
				<li><a><img class="icon" src="4.png" alt="image" width="32" height="32" /></a></li>
				<li><a><img class="icon" src="5.png" alt="image" width="32" height="32" /></a></li>

				<li><a><img class="icon" src="10.png" alt="image" width="32" height="32" /></a></li>
				<li><a><img class="icon" src="6.png" alt="image" width="32" height="32" /></a></li>
				<li><a><img class="icon" src="7.png" alt="image" width="32" height="32" /></a></li>
				<li><a><img class="icon" src="8.png" alt="image" width="32" height="32" /></a></li>
				<li><a><img class="icon" src="9.png" alt="image" width="32" height="32" /></a></li>
									
			</ul>
		</div>
	</div>
Step 4: Download files below
Files
[Only Registered users can see links . Click Here To Register...]
[Only Registered users can see links . Click Here To Register...]
[Only Registered users can see links . Click Here To Register...]
[Only Registered users can see links . Click Here To Register...]
[Only Registered users can see links . Click Here To Register...]
[Only Registered users can see links . Click Here To Register...]
[Only Registered users can see links . Click Here To Register...]
[Only Registered users can see links . Click Here To Register...]
[Only Registered users can see links . Click Here To Register...]
[Only Registered users can see links . Click Here To Register...]
[Only Registered users can see links . Click Here To Register...]
[Only Registered users can see links . Click Here To Register...]
[Only Registered users can see links . Click Here To Register...]
[Only Registered users can see links . Click Here To Register...]
[Only Registered users can see links . Click Here To Register...]
[Only Registered users can see links . Click Here To Register...]
[Only Registered users can see links . Click Here To Register...]
[Only Registered users can see links . Click Here To Register...]






Reply With Quote
  #78  
Old 07-20-2010, 12:34 AM
JavaScriptBank JavaScriptBank is offline
Senior Member
 
Join Date: Jul 2009
Posts: 207
Rep Power: 18
JavaScriptBank is on a distinguished road
Default 12 Awesome and Creative JavaScript Games you should try

Nowadays, with the rapid growth of superior technology (innovation, improvement of programming languages, power of processing), even the technical (processor and performance of computer are increasing... [Only Registered users can see links . Click Here To Register...] at [Only Registered users can see links . Click Here To Register...]


How to setup






Reply With Quote
  #79  
Old 07-21-2010, 09:56 AM
JavaScriptBank JavaScriptBank is offline
Senior Member
 
Join Date: Jul 2009
Posts: 207
Rep Power: 18
JavaScriptBank is on a distinguished road
Default Web based JavaScript Media Player

Bring the sound of life - music to your visitors by this JavaScript. It is an advanced web based midi player that actually enables you to jump, pause, and manipulate the play list like never before.... [Only Registered users can see links . Click Here To Register...] at [Only Registered users can see links . Click Here To Register...]


How to setup

Step 1: Place JavaScript below in your HEAD section
JavaScript
Code:
<SCRIPT language=JavaScript>
<!-- Begin
counter = 0;
html = true;
songs = new Array();
function addsong() {
file = document.forms[0].file.value;
if(file == "") {
alert("Entra un nombre de archivo o da click en Examinar..");
}
else {
fn = file;
while(fn.indexOf() != -1) {
pos = fn.indexOf();
fn = fn.substring(fn.lenght);
}
if(fn.indexOf(".gif") == 1) {
alert("Sólo sonidos o música");
}
else {
songs[counter] = file;
document.forms[0].selMusica[counter] = new Option(fn, file, false, true);
counter++;
}
document.forms[0].file.value = "";
}
}
function musica() {
document.all.sound.src=document.clock.selMusica.options[document.clock.selMusica.selectedIndex].text;
}
function stop() {
document.all.sound.src="";
}
function count() {
document.clock.songs.value=document.clock.selMusica.options.length;
}
function deletethis() {
if(counter > 0) {
counter--;
document.forms[0].selMusica[counter] = null;
songs[counter] = "";
}
else {
alert("No hay nada en la lista!");
   }
}
function bajar() {
document.clock.selMusica.options[document.clock.selMusica.selectedIndex++];
saber2();
saber();
}
function subir() {
document.clock.selMusica.options[document.clock.selMusica.selectedIndex--];
saber2();
saber();
}
function saber() {
document.clock.url.value=document.clock.selMusica.options[document.clock.selMusica.selectedIndex].text;
}
function saber2() {
fn = document.clock.selMusica.options[document.clock.selMusica.selectedIndex].text;
char = unescape("%5C");
while(fn.indexOf(char) != -1) {
pos = fn.indexOf(char);
fn = fn.substring(pos + 1, fn.length);
document.clock.nombre.value=fn;
}
}
// End-->
</SCRIPT>
Step 2: Place HTML below in your BODY section
HTML
Code:
<BODY onclick=count() onload=count()>
<BGSOUND id=sound src="">
<FORM name=clock><INPUT type=file name=file size="20"> <INPUT onclick=addsong() type=button value=Add><INPUT onclick=deletethis() type=button value=Delete><BR><INPUT onclick=musica() type=button value=Listen name=empezar> 
<INPUT onclick=stop() type=button value=Stop name=detener> You have:<INPUT 
readOnly size=2 name=songs>song(s) in the list.<BR>Name of the song:<INPUT 
size=25 name=nombre><INPUT onclick="saber2(); saber()" type=button value="Know Name & Url">Url 
	of the song:<INPUT size=19 name=url> <BR><INPUT onclick=bajar() type=button value=MoveDown><INPUT onclick=subir() type=button value=MoveUp><BR><BR><SELECT 
multiple size=20 name=selMusica></SELECT> </FORM>
</BODY>





Reply With Quote
Reply

Bookmarks


Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Forum Jump


All times are GMT. The time now is 01:44 PM.


Powered by vBulletin® Version 3.7.6
Copyright ©2000 - 2026, Jelsoft Enterprises Ltd.