Fader-Image Effects
This script demonstrates various techniques for fading the background of your selected HTML components such as buttons, text boxes, page backgrounds, and others to different color.
Installing Fader effect in your page
1. Copy the coding into the HEAD of your HTML document
2. Add the id property into the BODY tag
3. Put the last coding into the BODY of your HTML document
Paste this code into the HEAD of your HTML document
<HEAD><script type="text/javascript"><!-- Begin /* This script and many more are available free online at The JavaScript Source!! http://javascript.internet.com Created by: Tony Tschopp :: http://www.goodturnwebdesign.com *//* comp = name (ID="comp") of the HTML page component to fade cbeg = start value for color in #rrggbb format cend = end value for color in #rrggbb format iter = number of steps in the fade from start color to end color time = number of milliseconds to display each step rbeg = start value for red component of rbg color gbeg = start value for green component of rbg color bbeg = start value for blue component of rbg color rend = end value for red component of rbg color gend = end value for green component of rbg color bend = end value for blue component of rbg color */var hstr = '#'; var hdig = "0123456789abcdef"; function mOvr(comp, cbeg, cend, iter, time) { var rbeg = hdig.indexOf(cbeg.substr(1,1))*16 + hdig.indexOf(cbeg.substr(2,1)); var gbeg = hdig.indexOf(cbeg.substr(3,1))*16 + hdig.indexOf(cbeg.substr(4,1)); var bbeg = hdig.indexOf(cbeg.substr(5,1))*16 + hdig.indexOf(cbeg.substr(6,1)); var rend = hdig.indexOf(cend.substr(1,1))*16 + hdig.indexOf(cend.substr(2,1)); var gend = hdig.indexOf(cend.substr(3,1))*16 + hdig.indexOf(cend.substr(4,1)); var bend = hdig.indexOf(cend.substr(5,1))*16 + hdig.indexOf(cend.substr(6,1)); for ( i = 1, r = rbeg, g = gbeg, b = bbeg; i <= iter; r = Math.round(rbeg + i * ((rend - rbeg) / (iter-1))), g = Math.round(gbeg + i * ((gend - gbeg) / (iter-1))), b = Math.round(bbeg + i * ((bend - bbeg) / (iter-1))), i++ ) { hstr = '#' + hdig.charAt(Math.floor(r/16)) + hdig.charAt(r%16) + hdig.charAt(Math.floor(g/16)) + hdig.charAt(g%16) + hdig.charAt(Math.floor(b/16)) + hdig.charAt(b%16); setTimeout('var el = document.getElementById("' + comp + '"); el.style.backgroundColor = "' + hstr + '";', i * time); } }function mOut(comp, cbeg, cend, iter, time) { var rbeg = hdig.indexOf(cbeg.substr(1,1))*16 + hdig.indexOf(cbeg.substr(2,1)); var gbeg = hdig.indexOf(cbeg.substr(3,1))*16 + hdig.indexOf(cbeg.substr(4,1)); var bbeg = hdig.indexOf(cbeg.substr(5,1))*16 + hdig.indexOf(cbeg.substr(6,1)); var rend = hdig.indexOf(cend.substr(1,1))*16 + hdig.indexOf(cend.substr(2,1)); var gend = hdig.indexOf(cend.substr(3,1))*16 + hdig.indexOf(cend.substr(4,1)); var bend = hdig.indexOf(cend.substr(5,1))*16 + hdig.indexOf(cend.substr(6,1)); for ( i = 1, r = rend, g = gend, b = bend; i <= iter; r = Math.round(rend - i * ((rend - rbeg) / (iter-1))), g = Math.round(gend - i * ((gend - gbeg) / (iter-1))), b = Math.round(bend - i * ((bend - bbeg) / (iter-1))), i++ ) { hstr = '#' + hdig.charAt(Math.floor(r/16)) + hdig.charAt(r%16) + hdig.charAt(Math.floor(g/16)) + hdig.charAt(g%16) + hdig.charAt(Math.floor(b/16)) + hdig.charAt(b%16); setTimeout('var el = document.getElementById("' + comp + '"); el.style.backgroundColor = "' + hstr + '";', i * time); } } // End --></script></HEAD>
Daily Welcome Cookie
This script sets a cookie, with an alert window that only comes up the first time you visit the page each day. Good for calling attention to daily specials and news updates. Can be configured to work in other ways also.
Paste this code into the HEAD section of your HTML document
<script type="text/javascript" src="dailyCookie.js"></script>
Paste this code into an external JavaScript file named: dailyCookie.js
/* This script and many more are available free online at
The JavaScript Source!! http://javascript.internet.com
Created by: Ted Man | */
function getCookie(c_name) {
if (document.cookie.length>0) {
c_start=document.cookie.indexOf(c_name + "=")
if (c_start!=-1) {
c_start=c_start + c_name.length+1
c_end=document.cookie.indexOf(";",c_start)
if (c_end==-1) c_end=document.cookie.length
return unescape(document.cookie.substring(c_start,c_end))
}
}
return ""
}
function setCookie(c_name,value,expiredays) {
var exdate=new Date()
exdate.setDate(exdate.getDate()+expiredays)
document.cookie=c_name+ "=" + escape(value) + ((expiredays==null) ? "" : "; expires="+exdate.toGMTString())
}
function checkCookie() {
var todaysdate = new Date()
var day = todaysdate.getDay()
switch (day) {
case 1:
day = "Monday"
break
case 2:
day = "Tuesday"
break
case 3:
day = "Wednesday"
break
case 4:
day = "Thursday"
break
case 5:
day = "Friday"
break
case 6:
day = "Saturday"
break
case 0:
day = "Sunday"
break
}
var thedate = getCookie('thedate')
if (thedate != null && thedate != "") {
if (day == thedate) {
} else {
alert('Be sure to check our daily specials!')
}
} else {
thedate = day
if (thedate!=null && thedate!="") {
setCookie('thedate', thedate, 365)
alert('Be sure to check our daily specials!')
}
}
}
// 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() {
checkCookie();
});
Copy from Forms to Clipboard
There are many scripts for copying text from a Web page that work fine in MS Internet Explorer but not in Firefox, Netscape, or Opera. This cross-browser script, however, will do the trick. It will copy a designated portion of text into the Windows clipboard, using a small Macromedia Flash file to perform the copy on the browser’s behalf.
Paste this code into an external JavaScript file named: clipboardCopy.js
/* This script and many more are available free online atThe JavaScript Source!! http://javascript.internet.comCreated by: Mark O'Sullivan :: http://lussumo.com/ Jeff Larson :: http://www.jeffothy.com/ Mark Percival :: http://webchicanery.com/function copy(text2copy) { if (window.clipboardData) { window.clipboardData.setData("Text",text2copy); } else { var flashcopier = 'flashcopier'; if(!document.getElementById(flashcopier)) { var divholder = document.createElement('div'); divholder.id = flashcopier; document.body.appendChild(divholder); } document.getElementById(flashcopier).innerHTML = ''; var divinfo = '<embed src="_clipboard.swf" FlashVars="clipboard='+escape(text2copy)+'" width="0" height="0" type="application/x-shockwave-flash"></embed>'; document.getElementById(flashcopier).innerHTML = divinfo; }}
Paste this code into the HEAD section of your HTML document.
<script type="text/javascript" src="clipboardCopy.js"></script>
Paste this code into the BODY section of your HTML document
<form name="form1" action="">
<textarea name="results" cols="40" rows="6">All of the text here will be copied. Epsum factorial non deposit quid pro quo hic escorol. Olypian quarrels et gorilla congolium sic ad nauseum. Souvlaki ignitus carborundum.</textarea>
<br>
<input type="button" value="Copy This" onclick="copy(document.form1.results.value);">
</form>

RSS Feeds
Feed Comment 




Leave Your Comments Below