---
title: "onmouseover + css"
type: "forum-thread"
url: "https://www.webforum.nu/amne/javascript/151123-onmouseover-css"
topic: "JavaScript"
topic_url: "https://www.webforum.nu/amne/javascript"
author: "Qonny"
published: "2006-09-09T12:06:50.000Z"
updated: "2006-09-13T22:07:11.000Z"
replies: 2
views: 374
page: 1
pages: 1
language: "sv-SE"
site: "webForum — webforum.nu"
rights: "Upphovsrätten till varje inlägg tillhör dess författare."
attribution: "Citera som: webForum, https://www.webforum.nu/amne/javascript/151123-onmouseover-css"
---

# onmouseover + css

## #1 — Qonny, 2006-09-09T12:06Z

Hallojsan! Har försökt ett par dar att få 4 st textboxar i en container att ändra färg när man onmouseover.. det jag vill är att samtliga textboxar ska ändra färg när man kör onmouseover på containern. Går det? 

html ser ut så här:

```
<a href="#">
<div id="container" onMouseOver="this.style.cursor='pointer'; return overlib('<b>overlibinfo</b>'); " onMouseOut="return nd();">

<div id="box1"onMouseOver="this.className='hover1';" onMouseOut="this.className='text1';">info1</div>
<div id="box2"onMouseOver="this.className='hover1';" onMouseOut="this.className='text1';">info2</div>
<div id="box3"onMouseOver="this.className='hover1';" onMouseOut="this.className='text1';"><b>info3</b></div>
<div id="box4"onMouseOver="this.className='hover1';" onMouseOut="this.className='text1';"><b>info4</b></div>

</div>
</a>
```

 

css:

```
#list1{ width:430px; height:auto; margin-left:auto; margin-right:auto; margin-top: 6px; float:left; background-color:#8c94a0;font-family:arial; font-family:tahoma; font-size:10px; color:#ccccff; text-align:left; text-decoration:none;}
#box1{ width:365px; margin-left:2px; margin-bottom:4px; margin-top:4px; float:left;}
#box2{width:55px; margin-right:2px; margin-bottom:4px; margin-top:4px; float:right;text-align:right;}
#box3{width:380px; margin-left:2px; margin-bottom:2px; float:left;}
#box4{width:40px; margin-right:2px; margin-bottom:2px; float:right; text-align:right;}
.hover1{color:#ff6600; text-decoration:none;}
.text1{color:#ccccff; text-decoration:none;}
```

Som Ni ser så har jag gjor onmouseover i varje box... det funkar fast det blir lite missvisande när hela containern är länkad.

Permalänk: https://www.webforum.nu/p/151123

## #2 — Fuel, 2006-09-09T13:43Z

hmm.. du kanske kunde räkna alla med den klassen

```
var boxes = document.getElementsByClassName('boxclass');
for (i = 1; i <= boxes; i++){
document.getElementById('box_' + i).className = 'newclass';
}
```

Edit: glömde..

```
document.getElementsByClassName = function getElementsByClassName(classname) 
{ 
	var arr = new Array(); 
	var elems = document.getElementsByTagName("*");
	for ( var cls, i = 0; ( elem = elems[i] ); i++ )
	{
		if ( elem.className == classname )
		{
			arr[arr.length] = elem;
		}
	}
	return arr;
}
```

Permalänk: https://www.webforum.nu/p/1862863

## #3 — Qonny, 2006-09-13T22:07Z

skulle behöva lite mer hjälp... kan nämligen ingenting av Java... så jag fattar nada, så kanske det går att få det lite mer utformligare....   :r

Permalänk: https://www.webforum.nu/p/1867245

---

Tråden på webben: https://www.webforum.nu/amne/javascript/151123-onmouseover-css