...

View Full Version : Changing all form style on a page



micmania1
06-20-2008, 12:05 AM
Hi, I am trying to change all the styles of input boxes and buttons on my site using javascript.

I already have onmouseover and onmouseout events, which I now want to replace.

I am now creating a function which does it automatically but i'm having trouble with it. Here is my script:

function buttonStyle() {
for (var i=0; i < document.forms.length; i++) {
for(var a=0; a < document.forms[i].elements.length; a++) {
var thisElement = document.forms[i].elements[a];
alert(thisElement.type);
if ((thisElement.type == 'text') || (thisElement.type == 'submit') || (thisElement.type == 'reset') || (thisElement.type == 'button')) {
thisElement.onmouseover = 'this.style.borderColor = \'#FFCC00\'';
thisElement.onmouseout = 'this.style.borderColor = \'#000000\'';
}
}
}
}

It is having some effect because the onmouseover/out events that already exist hardcoded into the html are not working when it is being run.

Could somebody please tell me what is wrong?

Thanks in advance,
Michael

rangana
06-20-2008, 03:55 AM
You might mean something like this instead:


<script type="text/javascript">
function buttonStyle() {
var inps=document.getElementsByTagName('input')
for(var i=0;i<inps.length;i++)
{
if((inps[i].type=='text')||(inps[i].type=='submit')||(inps[i].type=='reset'))
{
inps[i].onmouseover=function()
{
this.style.borderColor='#fc0';
}
inps[i].onmouseout=function()
{
this.style.borderColor='#000';
}
}
}
}
</script>



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum