JavaScript: Generator Script -

JavaScript Section

Free JavaScript Collection

powered by

Main Generator Script Graphic Buttons Generator 2

<HEAD>

<style type="text/css">

<!--

.clickable{

cursor:hand;

}

td{

font-family:Helvetica,Sans Serif;

font-size:9pt;

}

#txt2{

visibility:hidden;

}

#txtv{

visibility:visible;

}

#ButtonRG{

background-color:lightgreen;

color:black;

}

#ButtonGR{

background-color:white;

color:red;

}

#ButtonBY{

background-color:lightblue;

color:black;

}

#ButtonYB{

background-color:yellow;

color:red;

}

-->

</style>

<script language="JavaScript">

<!--

function addColors(foreColor)

{

var clr=new Array("aa","bb","cc","dd","ee","ff");

var red=0,green=1,blue=2;

if(foreColor == 0)

{

for(red=0;red<6;red++)

{

for(green=0;green<6;green++)

{

for(blue=0;blue<6;blue++)

{

colorVal="#"+clr[red]+clr[green]+clr[blue];

document.write("<option value='"+colorVal+"' style='background-color:"+colorVal+"'>"+colorVal+"</option>");

}

}

}

}

else

{

for(red=0;red<6;red++)

{

for(green=0;green<6;green++)

{

for(blue=0;blue<6;blue++)

{

colorVal="#"+clr[red]+clr[green]+clr[blue];

document.write("<option value='"+colorVal+"' style='color:"+colorVal+"'><font color='"+colorVal+"'>"+colorVal+"</font></option>");

}

}

}

}

}

function change(obj,nid)

{

obj.id=nid;

}

function genCode(val)

{

document.frmButtons.srcCode.value="Hello";

if(val==1)

{

//Generate code for ButtonRG

with (document.frmButtons.srcCode)

{

value="";

value="//Paste this code in the HEAD part of your page";

value+="\n<"+"sc"+"ript language='JavaScript'>\n\n</sc"+"ript"+">";

value+="\n\n<sty"+"le type='text/css'>\n<!--\n#ButtonRG{\n\tbackground-color:lightgreen;\n\tcolor:black;\n\t}\n";

value+="#ButtonGR{\n\tbackground-color:white;\n\tcolor:red;\n\t}\n";

value+=".clickable{\n\tcursor:hand;\n\t}\n";

value+="-->\n</st"+"yle>\n";

value+="\n\n\n//Paste the HTML code in the BODY part of your page";

value+="\n<but"+"ton name='btnName' class='clickable' onMouseOver='change(this,\"ButtonGR\")' onMouseOut='change(this,\"ButtonRG\")' id='ButtonRG' onClick='alert(\"Handle Click Event\");' accessKey='C'><u"+"><b>C</b></u>aption"+"</but"+"ton>";

value+="\n//Change the Button name and caption to suit your needs";

}

}

else

{

//Generate code for ButtonBY

with (document.frmButtons.srcCode)

{

value="";

value="//Paste this code in the HEAD part of your page";

value+="\n<"+"sc"+"ript language='JavaScript'>\n\n</sc"+"ript"+">";

value+="\n\n<sty"+"le type='text/css'>\n<!--\n#ButtonBY{\n\tbackground-color:lightblue;\n\tcolor:black;\n\t}\n";

value+="#ButtonYB{\n\tbackground-color:yellow;\n\tcolor:red;\n\t}\n";

value+=".clickable{\n\tcursor:hand;\n\t}\n";

value+="-->\n</st"+"yle>\n";

value+="\n\n\n//Paste the HTML code in the BODY part of your page";

value+="\n<but"+"ton name='btnName' class='clickable'  onMouseOver='change(this,\"ButtonYB\")' onMouseOut='change(this,\"ButtonBY\")' id='ButtonBY' onClick='alert(\"Handle Click Event\");' accessKey='C'><u"+"><b>C</b></u>aption"+"</but"+"ton>";

value+="\n//Change the Button name and caption to suit your needs";

}

}

}

function genCustCode()

{

var temp="";

with (document.frmButtons.txtCustCode)

{

id="txt2v";

value="";

value="//Paste this code in the HEAD part of your page";

value+="\n<"+"sc"+"ript language='Javascript'>\n\n</sc"+"ript"+">";

value+="\n\n<sty"+"le type='text/css'>\n<!--\n#normBtn{\n\tbackground-color:"+document.frmButtons.nbkColor.value+";\n\tcolor:"+document.frmButtons.ntxtColor.value+";\n\t";

if(document.frmButtons.ntxtFont.value != "")

{

value+="font-family:"+document.frmButtons.ntxtFont.value+";\n\t";

}

if(document.frmButtons.ntxtSize.value != "")

{

value+="font-size:"+document.frmButtons.ntxtSize.value+";\n\t";

}

if(document.frmButtons.ntxtBold.value != "")

{

value+="font-weight:"+document.frmButtons.ntxtBold.value+";\n\t";

}

value+="}\n";

value+="#btnFocus{\n\tbackground-color:"+document.frmButtons.fbkColor.value+";\n\tcolor:";

value+=document.frmButtons.ftxtColor.value+";\n\t";

if(document.frmButtons.ftxtFont.value != "")

{

value+="font-family:"+document.frmButtons.ftxtFont.value+";\n\t";

}

if(document.frmButtons.ftxtSize.value != "")

{

value+="font-size:"+document.frmButtons.ftxtSize.value+";\n\t";

}

if(document.frmButtons.ftxtBold.value != "")

{

value+="font-weight:"+document.frmButtons.ftxtBold.value+";\n\t";

}

value+="}\n";

value+=".clickable{\n\tcursor:hand;\n\t}\n";

value+="-->\n</st"+"yle>\n";

value+="\n\n\n//Paste the HTML code in the BODY part of your page";

value+="\n<but"+"ton class='clickable' name='"+document.frmButtons.txtBtnName.value+"' onMouseOver='change(this,\"btnFocus\")' onMouseOut='change(this,\"normBtn\")' id='normBtn' onClick='alert(\"Handle Click Event\");'";

temp=addShortcutCode();

value+=temp;

}

document.frmButtons.txtCustCode.focus();

}

function replace(string,text,by)

{

// Replaces text with by in string

//Taken from "http://developer.irt.org/script/771.htm"

//Site for developer's questions regarding Javascript

var strLength = string.length, txtLength = text.length;

if ((strLength == 0) || (txtLength == 0)) return string;

var i = string.indexOf(text);

if ((!i) && (text != string.substring(0,txtLength))) return string;

if (i == -1) return string;

var newstr = string.substring(0,i) + by;

if (i+txtLength < strLength)

newstr += replace(string.substring(i+txtLength,strLength),text,by);

return newstr;

}

function addShortcutCode()

{

var caption,value="",temp="";

var i=0,j=0,len,ch;

caption=document.frmButtons.txtBtnCaption.value;

len=caption.length;

if(caption.indexOf('&')!=-1)

{

i=caption.indexOf('&');

value=" accessKey='"+caption.charAt(i+1)+"'>";

ch=caption.charAt(i+1);

temp=replace(caption,"&","");

caption=temp;

j=caption.indexOf(ch);

if(j == 0)

{

value+="<u><b>"+ch+"</b></u>"+caption.substring(j+1)+"</but"+"ton>";

}

else

{

value+=caption.substring(0,j)+"<b><u>"+ch+"</b></u>"+caption.substring(j+1)+"</but"+"ton>";

}

return value;

}

else

{

value=">"+caption+"</but"+"ton>";

return value;

}

}

-->

</script>

</HEAD>

<BODY>

<form name="frmButtons">

<table width="100%" border="0">

<tbody>

<tr>

<td><font face="Arial" size="3">Select the type of button you would like to have</font>

</td>

</tr>

<tr>

<td>

<input type="radio" value="ButtonRG" name="rdButton" /><button class="clickable" id="ButtonRG" onmouseover="change(this,'ButtonGR');" accesskey="1" onclick="alert('Handle Click Event');" onmouseout="change(this,'ButtonRG');">Button <u><b>1</b></u></button>

</td>

</tr>

<tr>

<td>

<input type="radio" value="ButtonBY" name="rdButton" /><button class="clickable" id="ButtonBY" onmouseover="change(this,'ButtonYB')" accesskey="2" onclick="alert('Handle Click Event');" onmouseout="change(this,'ButtonBY')">Button <u><b>2</b></u></button>

</td>

</tr>

<tr>

<td>

<input class="clickable" onclick="if(rdButton[0].checked) genCode(1); else if(rdButton[1].checked) genCode(2);else alert('Select a Button style');" type="button" value="Generate Code" name="btnGenerate" />

</td>

</tr>

<tr>

<td>

<textarea name="srcCode" rows="10" cols="60">

You can also specify custom Button Rollovers

Normal Button Background
Normal Text Color
Normal Text Font
Normal Text Size
Normal Text Weight
Button Background on Focus
Text Color on Focus
Text Font on Focus
Text Size on Focus
Text Weight on Focus
Button Name
Button Caption	^*Precede the letter or number with an Ampersand (&), if you want it as a shortcut key.

Free JavaScripts provided
by JavaScript Collection

Click Here if you need help to install the JavaScript

The Free source for javascript, java script, menu, form, calendar, forms, calendars, Ajax DHTML XML XSL XSLT RSS AJAX ASP ADO PHP

About Us :: Add to Favorite :: Make Home Page :: Tell your Friends :: Advertise :: Privacy

Copyright© 2002 Omduena, Inc. All rights reserved