[thelist] Javascript: altering BG color of multiple divs with one click

Tom Dell'Aringa pixelmech at yahoo.com
Tue Nov 11 10:48:43 CST 2003


--- Dunstan Orchard <dunstan at 1976design.com> wrote:
> Hi there,
> 
> I wonder if anyone could put on their best Javascript Pants and
> take a look at this problem for me:
> 
> http://www.1976design.com/dev/divcolor/

Dunstan,

Pasted below is the answer to the first part of your question. Can
you be a little more specific about the second part? It's going to be
difficult to have both going on at once I think, depending on what
you want.

Why do 2 divs change, etc - be a bit more specific...is it just divs
3 and 6 that do that?

Tom
-------------------------------------------------
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" 
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<title></title>
<style>
div {
	background-color: #eee;
	border: 1px solid #ddd;
	margin: 10px;
	padding: 10px;
	}

div:hover {
	background-color: #ddd;
	border: 1px solid #ccc;
	}
</style>
<script type="text/javascript">
var lastDiv;

function ChangeBG(oDiv)
{
	if(lastDiv) { lastDiv.style.backgroundColor = "#eee"; }
	oDiv.style.backgroundColor = "#cc3";
	lastDiv = oDiv;
}
</script>
</head>
<body>
<div id="one" onclick="ChangeBG(this);">Div 1</div>
<div id="two" onclick="ChangeBG(this);">Div 2</div>
<div id="three" onclick="ChangeBG(this);">Div 3 [clicking should
change colour of Div 1 as well]</div>
<div id="four" onclick="ChangeBG(this);">Div 4</div>
<div id="five" onclick="ChangeBG(this);">Div 5</div>
<div id="six" onclick="ChangeBG(this);">Div 6 [clicking should change
colour of Div 1 and Div 3 as well]</div>
</body>
</html>

=====
http://www.pixelmech.com/ :: Web Development Services
http://www.DMXzone.com/ :: JavaScript Author / Every Friday!
http://www.thywordistruth.net/ :: Eternal Life

"I'll ho ho and ha ha you!" (Daffy Duck)


More information about the thelist mailing list