Fader Maker 2

Vjekoslav Begovic Jun 28, 2003

Fader Maker is the simplest tools for creating the top-level color-fade effects. The generated scripts work in IE5+ and NN6+. Best of all it's free at the source.

See Example!
Download Provjera.js

The JavaScript Source: Image Effects: Fader Maker

Simply click inside the window below, use your cursor to highlight the script, and copy (type Control-c or Apple-c) the script into a new file in your text editor (such as Note Pad or Simple Text) and save (Control-s or Command-s). The script is yours!!!

<!-- THREE STEPS TO INSTALL FADER MAKER:

1.  Copy the coding into the HEAD of your HTML document

2.  Add the onLoad event handler into the BODY tag

3.  Put the last coding into the BODY of your HTML document  -->

<HEAD>

var palettevis = false;

var ref;

var fader_maker_timer = null;

var fader_maker_bgtimer = null;

var fg = false;

var bg = false;

var bdy = false;

var sb = false;

var fgswitch = false;

var bgswitch = false;

var bodyswitch = false;

var scrollswitch = false;

var font_family = new Array("serif","sans-serif","cursive","fantasy","monospace","Arial, Helvetica, sans-serif","Verdana, Geneva, sans-serif","'Times New Roman', Times, serif","'MS Serif', 'New York', serif","'Courier New', Courier, monospace");

var font_size = new Array('4','6','8','10','12','14','16','18','20','22','24','26','28','30','32','34','36','38','40','larger','smaller','xx-small','x-small','small','medium','large','x-large','xx-large');

var letter_spacing = new Array();

for (var i=0; i<30; i++)

letter_spacing[i] = i+1;

letter_spacing[30] = 'normal';

function pokazi(text,evt){

with (document.getElementById('opis').style){

if (document.all){

left = evt.x + 20;

top = evt.y + document.body.scrollTop;

}

else{

left = evt.pageX + 20;

top = evt.pageY;

}

visibility = 'visible';

}

document.getElementById('opis').innerHTML = text;

}

function sakrij(){

with(document.getElementById('opis').style){

visibility = 'hidden';

top = 0;

left = 0;

}

function idizamnom(evt){

with (document.getElementById('opis').style){

if (document.all){

left = evt.x + 20;

top = evt.y + document.body.scrollTop;

}

else{

left = evt.pageX + 20;

top = evt.pageY;

}

function toHex(n){

var hexChars = "0123456789ABCDEF";

if (n == 0) return "00";

var j, k;

var temp = "";

while (n != 0){

j = n % 16;

n = (n - j)/16;

temp = hexChars.charAt(j) + temp;

}

if (temp.length < 2){

temp = "0" + temp;

}

return temp;

}

function showpalette(evt){

with (document.getElementById('palette').style){

visibility = 'visible';

if (document.all){

left = evt.x;

top = evt.y + document.body.scrollTop;

}

else{

left = evt.pageX;

top = evt.pageY;

}

palettevis = true;

}

function validate(form){

if (isEmpty(form.msg.value)){

alert("Message field could not be empty!");

return false;

}

if ((!form.fadeTxtColor.checked) && (!form.fadeTxtBgColor.checked) && (!form.fadeBodyBgColor.checked) && (!form.fadeScrollColor.checked)){

alert("Please, check at least one Fade.");

return false;

}

if (form.fadeTxtColor.checked){

if (isEmpty(form.txtStrColor.value) || isEmpty(form.txtEndColor.value)){

alert("Please, fill color fields where Fade is checked.");

return false;

}

else{

if ((!isValidColor(form.txtStrColor.value)) || (!isValidColor(form.txtEndColor.value))){

alert("Not a valid color. You can use color palette by clicking an arrow.");

return false;

}

if (form.fadeTxtBgColor.checked){

if (isEmpty(form.txtStrBgColor.value) || isEmpty(form.txtEndBgColor.value)){

alert("Please, fill color fields where Fade is checked.");

return false;

}

else{

if ((!isValidColor(form.txtStrBgColor.value)) || (!isValidColor(form.txtEndBgColor.value))){

alert("Not a valid color. You can use color palette by clicking an arrow.");

return false;

}

if (form.fadeBodyBgColor.checked){

if (isEmpty(form.bodyStrColor.value) || isEmpty(form.bodyEndColor.value)){

alert("Please, fill color fields where Fade is checked.");

return false;

}

else{

if ((!isValidColor(form.bodyStrColor.value)) || (!isValidColor(form.bodyEndColor.value))){

alert("Not a valid color. You can use color palette by clicking an arrow.");

return false;

}

if (form.fadeScrollColor.checked){

if (isEmpty(form.scrollStrColor.value) || isEmpty(form.scrollEndColor.value)){

alert("Please, fill color fields where Fade is checked.");

return false;

}

else{

if ((!isValidColor(form.scrollStrColor.value)) || (!isValidColor(form.scrollEndColor.value))){

alert("Not a valid color. You can use color palette by clicking an arrow.");

return false;

}

if (!isPosInteger(form.speed.value)){

alert("Speed must be a positive integer.");

return false;

}

return true;

}

function fade(){

if (fg){

color = "#" + toHex(str_red_txt) + toHex(str_green_txt) + toHex(str_blue_txt);

document.getElementById('tekst').style.color = color;

}

if (bg){

backcolor = "#" + toHex(str_red_bgtxt) + toHex(str_green_bgtxt) + toHex(str_blue_bgtxt);

document.getElementById('tekst').style.backgroundColor = backcolor;

}

if (bdy){

bdycolor = "#" + toHex(str_red_bdy) + toHex(str_green_bdy) + toHex(str_blue_bdy);

document.bgColor = bdycolor;

}

if (sb){

scrollcolor = "#" + toHex(str_red_scroll) + toHex(str_green_scroll) + toHex(str_blue_scroll);

document.body.style.scrollbarFaceColor = scrollcolor;

}

if (fg){

if (end_red_txt != str_red_txt){

if (end_red_txt > str_red_txt){

str_red_txt++;

}

else{

str_red_txt--;

}

if (end_green_txt != str_green_txt){

if (end_green_txt > str_green_txt){

str_green_txt++;

}

else{

str_green_txt--;

}

if (end_blue_txt != str_blue_txt){

if (end_blue_txt > str_blue_txt){

str_blue_txt++;

}

else{

str_blue_txt--;

}

if (bg){

if (end_red_bgtxt != str_red_bgtxt){

if (end_red_bgtxt > str_red_bgtxt){

str_red_bgtxt++;

}

else{

str_red_bgtxt--;

}

if (end_green_bgtxt != str_green_bgtxt){

if (end_green_bgtxt > str_green_bgtxt){

str_green_bgtxt++;

}

else{

str_green_bgtxt--;

}

if (end_blue_bgtxt != str_blue_bgtxt){

if (end_blue_bgtxt > str_blue_bgtxt){

str_blue_bgtxt++;

}

else{

str_blue_bgtxt--;

}

if (bdy){

if (end_red_bdy != str_red_bdy){

if (end_red_bdy > str_red_bdy){

str_red_bdy++;

}

else{

str_red_bdy--;

}

if (end_green_bdy != str_green_bdy){

if (end_green_bdy > str_green_bdy){

str_green_bdy++;

}

else{

str_green_bdy--;

}

if (end_blue_bdy != str_blue_bdy){

if (end_blue_bdy > str_blue_bdy){

str_blue_bdy++;

}

else{

str_blue_bdy--;

}

if (sb){

if (end_red_scroll != str_red_scroll){

if (end_red_scroll > str_red_scroll){

str_red_scroll++;

}

else{

str_red_scroll--;

}

if (end_green_scroll != str_green_scroll){

if (end_green_scroll > str_green_scroll){

str_green_scroll++;

}

else{

str_green_scroll--;

}

if (end_blue_scroll != str_blue_scroll){

if (end_blue_scroll > str_blue_scroll){

str_blue_scroll++;

}

else{

str_blue_scroll--;

}

if ((str_red_txt == end_red_txt) && (str_green_txt == end_green_txt) && (str_blue_txt == end_blue_txt) && (str_red_bgtxt == end_red_bgtxt) && (str_green_bgtxt == end_green_bgtxt) && (str_blue_bgtxt == end_blue_bgtxt) && (str_red_bdy == end_red_bdy) && (str_green_bdy == end_green_bdy) && (str_blue_bdy == end_blue_bdy) && (str_red_scroll == end_red_scroll) && (str_green_scroll == end_green_scroll) && (str_blue_scroll == end_blue_scroll)){

window.clearTimeout(fader_maker_timer);

if (document.fader.loop.checked){

preview();

}

else{

fader_maker_timer = window.setTimeout("fade()", parseInt(document.fader.speed.value));

}

function preview(){

if (validate(document.fader)){

document.getElementById('tekst').innerHTML = document.fader.msg.value;

document.getElementById('tekst').style.fontFamily = document.fader.family.options[document.fader.family.selectedIndex].value;

document.getElementById('tekst').style.fontSize = document.fader.size.options[document.fader.size.selectedIndex].value;

document.getElementById('tekst').style.letterSpacing = document.fader.spacing.options[document.fader.spacing.selectedIndex].value;

if (document.fader.bold.checked){

document.getElementById('tekst').style.fontWeight = "bold";

}

else{

document.getElementById('tekst').style.fontWeight = "normal";

}

if (document.fader.italic.checked){

document.getElementById('tekst').style.fontStyle = "italic";

}

else{

document.getElementById('tekst').style.fontStyle = "normal";

}

if (document.fader.fadeTxtColor.checked){

fader_maker_txtstart = document.fader.txtStrColor.value;

fader_maker_txtstop =  document.fader.txtEndColor.value;

if (!fgswitch){

priv = fader_maker_txtstart;

fader_maker_txtstart = fader_maker_txtstop;

fader_maker_txtstop	= priv;

}

fgswitch = !fgswitch;

}

else{

fader_maker_txtstart = "#000000";

fader_maker_txtstop =  "#000000";

fg = false;

}

str_red_txt = eval("0x"+fader_maker_txtstart.substring(1,3));

str_green_txt = eval("0x"+fader_maker_txtstart.substring(3,5));

str_blue_txt = eval("0x"+fader_maker_txtstart.substring(5,7));

end_red_txt = eval("0x"+fader_maker_txtstop.substring(1,3));

end_green_txt = eval("0x"+fader_maker_txtstop.substring(3,5));

end_blue_txt = eval("0x"+fader_maker_txtstop.substring(5,7));

if (fader_maker_txtstart == fader_maker_txtstop){

document.getElementById('tekst').style.color = fader_maker_txtstart;

}

else{

if(document.fader.fadeTxtColor.checked){

fg = true;

}

if (document.fader.fadeTxtBgColor.checked){

fader_maker_bgtxtstart = document.fader.txtStrBgColor.value;

fader_maker_bgtxtstop =  document.fader.txtEndBgColor.value;

if (!bgswitch){

priv = fader_maker_bgtxtstart;

fader_maker_bgtxtstart = fader_maker_bgtxtstop;

fader_maker_bgtxtstop	= priv;

}

bgswitch = !bgswitch;

}

else{

fader_maker_bgtxtstart = "#FFFFFF";

fader_maker_bgtxtstop =  "#FFFFFF";

bg = false;

}

str_red_bgtxt = eval("0x"+fader_maker_bgtxtstart.substring(1,3));

str_green_bgtxt = eval("0x"+fader_maker_bgtxtstart.substring(3,5));

str_blue_bgtxt = eval("0x"+fader_maker_bgtxtstart.substring(5,7));

end_red_bgtxt = eval("0x"+fader_maker_bgtxtstop.substring(1,3));

end_green_bgtxt = eval("0x"+fader_maker_bgtxtstop.substring(3,5));

end_blue_bgtxt = eval("0x"+fader_maker_bgtxtstop.substring(5,7));

if (fader_maker_bgtxtstart == fader_maker_bgtxtstop){

document.getElementById('tekst').style.backgroundColor = fader_maker_bgtxtstart;

}

else{

if (document.fader.fadeTxtBgColor.checked){

bg = true;

}

if (document.fader.fadeBodyBgColor.checked){

fader_maker_bodystart = document.fader.bodyStrColor.value;

fader_maker_bodystop =  document.fader.bodyEndColor.value;

if (!bodyswitch){

priv = fader_maker_bodystart;

fader_maker_bodystart = fader_maker_bodystop;

fader_maker_bodystop = priv;

}

bodyswitch = !bodyswitch;

}

else{

fader_maker_bodystart = "#FFFFFF";

fader_maker_bodystop =  "#FFFFFF";

bdy = false;

}

str_red_bdy = eval("0x"+fader_maker_bodystart.substring(1,3));

str_green_bdy = eval("0x"+fader_maker_bodystart.substring(3,5));

str_blue_bdy = eval("0x"+fader_maker_bodystart.substring(5,7));

end_red_bdy = eval("0x"+fader_maker_bodystop.substring(1,3));

end_green_bdy = eval("0x"+fader_maker_bodystop.substring(3,5));

end_blue_bdy = eval("0x"+fader_maker_bodystop.substring(5,7));

if (fader_maker_bodystart == fader_maker_bodystop){

document.bgColor = fader_maker_bodystart;

bdy = false;

}

else{

if(document.fader.fadeBodyBgColor.checked){

bdy = true;

}

if (document.fader.fadeScrollColor.checked){

fader_maker_scrollstart = document.fader.scrollStrColor.value;

fader_maker_scrollstop =  document.fader.scrollEndColor.value;

if (!scrollswitch){

priv = fader_maker_scrollstart;

fader_maker_scrollstart = fader_maker_scrollstop;

fader_maker_scrollstop = priv;

}

scrollswitch = !scrollswitch;

}

else{

fader_maker_scrollstart = "#cccccc";

fader_maker_scrollstop =  "#cccccc";

sb = false;

}

str_red_scroll = eval("0x"+fader_maker_scrollstart.substring(1,3));

str_green_scroll = eval("0x"+fader_maker_scrollstart.substring(3,5));

str_blue_scroll = eval("0x"+fader_maker_scrollstart.substring(5,7));

end_red_scroll = eval("0x"+fader_maker_scrollstop.substring(1,3));

end_green_scroll = eval("0x"+fader_maker_scrollstop.substring(3,5));

end_blue_scroll = eval("0x"+fader_maker_scrollstop.substring(5,7));

if (fader_maker_scrollstart == fader_maker_scrollstop){

document.body.style.scrollbarFaceColor = fader_maker_scrollstart;

sb = false;

}

else{

if(document.fader.fadeScrollColor.checked){

sb = true;

}

fade();

}

function setDefaultValues(){

with(document.fader){

msg.value = document.getElementById('tekst').innerText = "Fader Maker";

fadeTxtColor.checked = true;

speed.value="50";

txtStrColor.value = document.getElementById('txtStrColor').style.backgroundColor = "#FF0000";

txtEndColor.value = document.getElementById('txtEndColor').style.backgroundColor = "#0000FF";

family.options[6].selected = true;

size.options[27].selected = true;

family.style.backgroundColor = "#cccccc";

size.style.backgroundColor = "#cccccc";

spacing.style.backgroundColor = "#cccccc";

bold.checked = true;

fmevent.options[0].checked = true;

spacing.options[30].selected = true;

loop.checked = true;

}

document.getElementById('generatedCode').value = "";

preview();

}

function resetform(){

document.fader.reset();

document.fader.txtStrColor.style.backgroundColor = 'white';

document.fader.txtEndColor.style.backgroundColor = 'white';

document.fader.txtStrBgColor.style.backgroundColor = 'white';

document.fader.txtEndBgColor.style.backgroundColor = 'white';

document.fader.bodyStrColor.style.backgroundColor = 'white';

document.fader.bodyEndColor.style.backgroundColor = 'white';

document.fader.scrollStrColor.style.backgroundColor = 'white';

document.fader.scrollEndColor.style.backgroundColor = 'white';

document.fader.generatedCode.value = "";

}

function generatecode(){

if (validate(document.fader)){

if (document.fader.fmevent.options[1].selected){

var fmButtonText = prompt("Specify text on your button", "Fade!");

if (fmButtonText == "") fmButtonText = "Fade!";

code = "4";

}

else { code="3"; }

code +=" steps to implement your script:\n\n"

code += "1. Place this into the HEAD section of your page.\n\n";

code += "<script language = \"JavaScript\">\n";

code +="<!--Created by Fader Maker (http://www.bosiljak.hr/fadermaker/)\n";

code += "var fmTimer = null;\n";

if (document.fader.loop.checked){

if (document.fader.fadeTxtColor.checked)

code+="var fmfg = false;\n";

if (document.fader.fadeTxtBgColor.checked)

code+="var fmbg = false;\n";

if (document.fader.fadeBodyBgColor.checked)

code+="var fmbody = false;\n";

if (document.fader.fadeScrollColor.checked)

code+="var fmscroll = false;\n";

}

code += "function fminit(){\n";

code += "if (!document.getElementById) return;\n";

if (document.fader.fadeTxtColor.checked){

var fader_maker_txtstart = document.fader.txtStrColor.value;

var fader_maker_txtstop =  document.fader.txtEndColor.value;

var fma1 = eval("0x"+fader_maker_txtstart.substring(1,3));

var fma2 = eval("0x"+fader_maker_txtstart.substring(3,5));

var fma3 = eval("0x"+fader_maker_txtstart.substring(5,7));

var fma4 = eval("0x"+fader_maker_txtstop.substring(1,3));

var fma5 = eval("0x"+fader_maker_txtstop.substring(3,5));

var fma6 = eval("0x"+fader_maker_txtstop.substring(5,7));

code += "fma1="+fma1+"; fma2="+fma2+"; fma3="+fma3+";\n";

code += "fma4="+fma4+"; fma5="+fma5+"; fma6="+fma6+";\n";

if (document.fader.loop.checked){

code += "if (!fmfg){\n";

code += "fmtemp=fma1; fma1=fma4; fma4=fmtemp; fmtemp=fma2; fma2=fma5; fma5=fmtemp; fmtemp=fma3; fma3=fma6; fma6=fmtemp;\n";

code += "}\n";

code += "fmfg = !fmfg;\n";

}

if (document.fader.fadeTxtBgColor.checked){

fader_maker_bgtxtstart = document.fader.txtStrBgColor.value;

fader_maker_bgtxtstop =  document.fader.txtEndBgColor.value;

var fmb1 = eval("0x"+fader_maker_bgtxtstart.substring(1,3));

var fmb2 = eval("0x"+fader_maker_bgtxtstart.substring(3,5));

var fmb3 = eval("0x"+fader_maker_bgtxtstart.substring(5,7));

var fmb4 = eval("0x"+fader_maker_bgtxtstop.substring(1,3));

var fmb5 = eval("0x"+fader_maker_bgtxtstop.substring(3,5));

var fmb6 = eval("0x"+fader_maker_bgtxtstop.substring(5,7));

code += "fmb1="+fmb1+"; fmb2="+fmb2+"; fmb3="+fmb3+";\n";

code += "fmb4="+fmb4+"; fmb5="+fmb5+"; fmb6="+fmb6+";\n";

if (document.fader.loop.checked){

code += "if (!fmbg){\n";

code += "fmtemp=fmb1; fmb1=fmb4; fmb4=fmtemp; fmtemp=fmb2; fmb2=fmb5; fmb5=fmtemp; fmtemp=fmb3; fmb3=fmb6; fmb6=fmtemp;\n";

code += "}\n";

code += "fmbg = !fmbg;\n";

}

if (document.fader.fadeBodyBgColor.checked){

fader_maker_bodystart = document.fader.bodyStrColor.value;

fader_maker_bodystop =  document.fader.bodyEndColor.value;

var fmc1 = eval("0x"+fader_maker_bodystart.substring(1,3));

var fmc2 = eval("0x"+fader_maker_bodystart.substring(3,5));

var fmc3 = eval("0x"+fader_maker_bodystart.substring(5,7));

var fmc4 = eval("0x"+fader_maker_bodystop.substring(1,3));

var fmc5 = eval("0x"+fader_maker_bodystop.substring(3,5));

var fmc6 = eval("0x"+fader_maker_bodystop.substring(5,7));

code += "fmc1="+fmc1+"; fmc2="+fmc2+"; fmc3="+fmc3+";\n";

code += "fmc4="+fmc4+"; fmc5="+fmc5+"; fmc6="+fmc6+";\n";

if (document.fader.loop.checked){

code += "if (!fmbody){\n";

code += "fmtemp=fmc1; fmc1=fmc4; fmc4=fmtemp; fmtemp=fmc2; fmc2=fmc5; fmc5=fmtemp; fmtemp=fmc3; fmc3=fmc6; fmc6=fmtemp;\n";

code += "}\n";

code += "fmbody = !fmbody;\n";

}

if (document.fader.fadeScrollColor.checked){

fader_maker_scrollstart = document.fader.scrollStrColor.value;

fader_maker_scrollstop =  document.fader.scrollEndColor.value;

var fmd1 = eval("0x"+fader_maker_scrollstart.substring(1,3));

var fmd2 = eval("0x"+fader_maker_scrollstart.substring(3,5));

var fmd3 = eval("0x"+fader_maker_scrollstart.substring(5,7));

var fmd4 = eval("0x"+fader_maker_scrollstop.substring(1,3));

var fmd5 = eval("0x"+fader_maker_scrollstop.substring(3,5));

var fmd6 = eval("0x"+fader_maker_scrollstop.substring(5,7));

code += "fmd1="+fmd1+"; fmd2="+fmd2+"; fmd3="+fmd3+";\n";

code += "fmd4="+fmd4+"; fmd5="+fmd5+"; fmd6="+fmd6+";\n";

if (document.fader.loop.checked){

code += "if (!fmscroll){\n";

code += "fmtemp=fmd1; fmd1=fmd4; fmd4=fmtemp; fmtemp=fmd2; fmd2=fmd5; fmd5=fmtemp; fmtemp=fmd3; fmd3=fmd6; fmd6=fmtemp;\n";

code += "}\n";

code += "fmscroll = !fmscroll;\n";

}

code += "fmFade();\n";

code += "}\n";

code += "function fmToHex(n){\n";

code += "var hexChars = \"0123456789ABCDEF\";\n";

code += "if (n == 0) return \"00\";\n";

code += "var j, n;\n";

code += "var temp = \"\";\n";

code += "while (n != 0){\n";

code += "j = n % 16;\n";

code += "n = (n - j)/16;\n";

code += "temp = hexChars.charAt(j) + temp;\n";

code += "}\n";

code += "if (temp.length < 2){\n";

code += "temp = \"0\" + temp;\n";

code += "}\n";

code += "return temp;\n";

code += "}\n\n";

code += "function fmFade(){\n";

code += "obj = document.getElementById('tekst').style;\n";

if (document.fader.fadeTxtColor.checked){

code += "fmcolor = \"#\" + fmToHex(fma1) + fmToHex(fma2) + fmToHex(fma3);\n";

code += "obj.color = fmcolor;\n";

code += "if (fma1 != fma4){\n";

code += "if (fma4 > fma1){fma1++;}\n";

code += "else{fma1--;}}\n";

code += "if (fma2 != fma5){\n";

code += "if (fma5 > fma2){fma2++;}\n";

code += "else{fma2--;}}\n";

code += "if (fma3 != fma6){\n";

code += "if (fma6 > fma3){fma3++;}\n";

code += "else{fma3--;}}\n";

}

if (document.fader.fadeTxtBgColor.checked){

code += "fmbackcolor = \"#\" + fmToHex(fmb1) + fmToHex(fmb2) + fmToHex(fmb3);\n";

code += "obj.backgroundColor = fmbackcolor;\n";

code += "if (fmb1 != fmb4){\n";

code += "if (fmb4 > fmb1){fmb1++;}\n";

code += "else{fmb1--;}}\n";

code += "if (fmb2 != fmb5){\n";

code += "if (fmb5 > fmb2){fmb2++;}\n";

code += "else{fmb2--;}}\n";

code += "if (fmb3 != fmb6){\n";

code += "if (fmb6 > fmb3){fmb3++;}\n";

code += "else{fmb3--;}}\n";

}

if (document.fader.fadeBodyBgColor.checked){

code += "fmbodycolor = \"#\" + fmToHex(fmc1) + fmToHex(fmc2) + fmToHex(fmc3);\n";

code += "document.bgColor = fmbodycolor;\n";

code += "if (fmc1 != fmc4){\n";

code += "if (fmc4 > fmc1){fmc1++;}\n";

code += "else{fmc1--;}}\n";

code += "if (fmc2 != fmc5){\n";

code += "if (fmc5 > fmc2){fmc2++;}\n";

code += "else{fmc2--;}}\n";

code += "if (fmc3 != fmc6){\n";

code += "if (fmc6 > fmc3){fmc3++;}\n";

code += "else{fmc3--;}}\n";

}

if (document.fader.fadeScrollColor.checked){

code += "if (document.all){\n";

code += "fmscrollcolor = \"#\" + fmToHex(fmd1) + fmToHex(fmd2) + fmToHex(fmd3);\n";

code += "document.body.style.scrollbarFaceColor = fmscrollcolor;\n";

code += "if (fmd1 != fmd4){\n";

code += "if (fmd4 > fmd1){fmd1++;}\n";

code += "else{fmd1--;}}\n";

code += "if (fmd2 != fmd5){\n";

code += "if (fmd5 > fmd2){fmd2++;}\n";

code += "else{fmd2--;}}\n";

code += "if (fmd3 != fmd6){\n";

code += "if (fmd6 > fmd3){fmd3++;}\n";

code += "else{fmd3--;}}\n";

code+="}\n";

code+="else{fmd1=fmd2=fmd3=fmd4=fmd5=fmd6=0}\n";

}

code += "if (";

if (document.fader.fadeTxtColor.checked){

code += "(fma1 == fma4) && (fma2 == fma5) && (fma3 == fma6)";

if (document.fader.fadeTxtBgColor.checked){

code += " && (fmb1 == fmb4) && (fmb2 == fmb5) && (fmb3 == fmb6)";

}

if (document.fader.fadeBodyBgColor.checked){

code += " && (fmc1 == fmc4) && (fmc2 == fmc5) && (fmc3 == fmc6)\n";

}

if (document.fader.fadeScrollColor.checked){

code += " && (fmd1 == fmd4) && (fmd2 == fmd5) && (fmd3 == fmd6)\n";

}

else{

if (document.fader.fadeTxtBgColor.checked){

code += "(fmb1 == fmb4) && (fmb2 == fmb5) && (fmb3 == fmb6)";

if (document.fader.fadeBodyBgColor.checked){

code += " && (fmc1 == fmc4) && (fmc2 == fmc5) && (fmc3 == fmc6)\n";

}

if (document.fader.fadeScrollColor.checked){

code += " && (fmd1 == fmd4) && (fmd2 == fmd5) && (fmd3 == fmd6)\n";

}

else{

if (document.fader.fadeBodyBgColor.checked){

code += "(fmc1 == fmc4) && (fmc2 == fmc5) && (fmc3 == fmc6)\n";

if (document.fader.fadeScrollColor.checked){

code += " && (fmd1 == fmd4) && (fmd2 == fmd5) && (fmd3 == fmd6)\n";

}

else{

code += "(fmd1 == fmd4) && (fmd2 == fmd5) && (fmd3 == fmd6)\n";

}

code += "){\n";

code += "window.clearTimeout(fmTimer);\n";

if (document.fader.loop.checked){

code += "fminit()";

}

code += "}\n";

code += "else{\n";

code += "fmTimer = window.setTimeout(\"fmFade()\"," + parseInt(document.fader.speed.value)+");\n";

code += "}\n";

if (document.fader.fmevent.options[0].selected)

code += "onload = fminit\n";

code += "-->\n";

code += "</script"+">\n\n";

code += "2. Put this on the place where you want your message to be.\n\n";

code += "<span id=\"tekst\" style=\"font-size:"+document.fader.size.options[document.fader.size.selectedIndex].value+"; font-family: "+document.fader.family.options[document.fader.family.selectedIndex].value+"; letter-spacing:"+document.fader.spacing.options[document.fader.spacing.selectedIndex].value+"; font-weight:"

if (document.fader.bold.checked){

code += "bold";

}

else{

code += "normal";

}

code += "; font-style:";

if (document.fader.italic.checked){

code += "italic";

}

else{

code += "normal";

}

code += "; padding-left:20; padding-right:20;\"";

if (document.fader.fmevent.options[2].selected)

code+=" onmouseover=\"fminit()\"";

code+=">"+document.fader.msg.value+"</span>\n\n";

if (!document.fader.fmevent.options[1].selected)

code += "3. Enjoy!";

if (document.fader.fmevent.options[1].selected){

code += "3. Put this where you want your button to be.\n\n";

code += "<input type=\"button\" value=\""+fmButtonText+"\" onclick=\"fminit()\">\n\n";

code += "4. Enjoy!";

}

document.getElementById('generatedCode').value = code;

}

function processblur(field){

if (isValidColor(field.value))

field.style.backgroundColor = field.value;

else

field.style.backgroundColor = 'white';

}

function hidepalette(){

palettevis = !palettevis;

if (palettevis){

paletevis=false;

document.getElementById('palette').style.visibility='hidden';

}

</script>

<style>

div#palette{

border:outset;

background-color:white;

position:absolute;

visibility:hidden;

Z-index: 10;

}

div#opis {

font-family : sans-serif;

font-size : small;

font-style : normal;

border : yellow;

background : #ffffcc;

visibility : hidden;

top : 0px;

left : 0px;

z-index : 100;

font-family: Verdana, Arial, Helvetica, sans-serif;

font-size: 12px;

padding : 3 px, 10px;

}

span#tekst {

text-align:center;

font-size:xx-large;

font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;

font-weight: bold;

padding-left:20;

padding-right:20;

}

a.highlight{

text-decoration:none;

color:blue;

}

</style>

</HEAD>

for (k=0; k<256; k+=51){

document.write("<tr>");

for (i=0; i<256; i+=51){

if (i==153) document.write("<tr>");

for (j=0; j<256; j+=51){

document.write("<td style=\"width:10; height:15; cursor:hand;\" bgcolor=\""+toHex(i)+toHex(k)+toHex(j)+"\" onClick=\"ref.value = ref.style.backgroundColor = this.bgColor.toString().toUpperCase(); document.getElementById('palette').style.visibility = 'hidden';\" onMouseOver=\"pokazi(this.bgColor.toString().toUpperCase(), event)\" onMouseMove=\"idizamnom(event)\" onMouseOut = \"sakrij()\"></td>");

}

document.write("</tr>");

}

</script>

</table>

</div>

</div>

</p>

<table>

<tr>

<td>

for (var i=0; i<font_family.length; i++)

document.write("<option style=\"font-size:smaller;\" value=\""+font_family[i]+"\">"+font_family[i]+"</option>");

</script>

</select>

</td>

<td>

for (var i=0; i<font_size.length; i++)

document.write("<option value=\""+font_size[i]+"\">"+font_size[i]+"</option>");

</script>

</select>

</td>

<td style="padding-left:7">Italic<input type="checkbox" name="italic"></td>

<td style="padding-left:7">Spacing</td>

<td>

for (var i=0; i<letter_spacing.length; i++)

document.write("<option value=\""+letter_spacing[i]+"\">"+letter_spacing[i]+"</option>");

</script>

</select>

</td>

</tr>

</table>

<p>

<table>

<tr>

<th colspan="2">From color:</th>

<th colspan="2">To color:</th>

</tr>

<tr>

<td>Text Color</td>

</tr>

<tr>

<td>Text Background Color</td>

</tr>

<tr>

<td>Document Background Color</td>

</tr>

<tr>

<td>Scrollbar Color <span style="color:blue;">(IE5.5+)</span></td>

</tr>

</table>

</p>

<p>

<table>

<tr>

<th>Event</th>

<option value="onclick">on button click</option>

<option value="onmouseover">on mouse over</option>

</select>

</td>

<th style="padding-left:20">Speed</th>

</tr>

</table>

</p>

<tr>

</tr>

</table>

</p>

<p>

<strong>Generated Code</strong><a class="highlight" href = "javascript:document.getElementById('generatedCode').focus();document.getElementById('generatedCode').select();"> [Highlight all]</a>

<br>

</p>

</form>

<font face="arial, helvetica" size"-2">Free JavaScripts provided<br>

by <a href="http://javascriptsource.com">The JavaScript Source</a></font>

</center><p>

Did you use this script? Do you like this site? Please link to us!

Leave a Response

(0 comments)

Alphabetical Listing

Tutorials

Ajax Tutorials

Ajax

Buttons

Cookies

CSS

Forms

Games

Generators

Image Effects

Math Related

Miscellaneous

Multimedia

Navigation

Page Details

Password

Snippets

Text Effects

Time & Date

User Details

Fader Maker 2

Leave a Response

Attention JavaScript Coders

Go Deeper