changing the classname of a div

Hi There,

I'm trying to use javascript to change the class name of an object (div) with onmouseover and onmouseout events. I tried the code below which seems to work fine in IE and Safari but FF is returning an error:

ctl00_mainContent_1 is not defined

Can someone post some cross browser code that will perform a similar function without giving me an error?

Sean - thanks in advance

!----- js code
 
function setClassName(objId, className) {
    	document.getElementById(objId.getAttribute("id")).className = className;
}
 
--html code
 
        <div id="ctl00_mainContent_1" class="thumbs"><a href="#" onclick="NextPreviouspage(1);" onmouseover="setClassName(ctl00_mainContent_1,'thumbsGlow');" onmouseout="setClassName(ctl00_mainContent_1,'thumbs');"><img src="images/photography/thumb_1.jpg" border="0" /><a/></div>

Open in new window

LVL 8
MrAgileAsked:
Who is Participating?
 
naspinskiConnect With a Mentor Commented:
youw ill need to be a bit more thorough to cover all browsers
var newObject = document.getElementById(objId)
newObject.setAttribute('className', 'name_of_css_class');// for IE
newObject.setAttribute('class', 'name_of_css_class');// for others (these are both needed)

Open in new window

0
 
Pratima PharandeCommented:
Try like this

 function setClassName(objId, className) {
          document.getElementById(objId).className = className;
}

</script>
<style>
.x
{
 background-color:Aqua;
}

.y
{
 background-color:Lime;
}
</style>

<div id="div1" class="x" onmouseover="setClassName('div1','y')">
     
0
 
zemondCommented:
onmouseover="setClassName(ctl00_mainContent_1,'thumbsGlow');"

turn into

onmouseover="this.className = 'thumbsGlow'"

Should be fine in modern browsers
0
 
MrAgileAuthor Commented:
Hi All,

Thanks for the answers. naspinski's answer was the one that worked in all browsers. I appreciate everyone's help.


Sean
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.