Idee:
<!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">
<head>
<title> </title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" >
//requires cssQuery from http://dean.edwards.name/my/cssQuery.js.html
var myColor
function setColor(colorcode)
{
myColor = colorcode;
}
function paintColor(myTagName,myClassName)
{
if(myColor == undefined)
{
return true;
}
else
{
var applyTo = cssQuery(myTagName+"."+myClassName)
alert(myTagName+"."+myClassName);
for (var i = 0; i < applyTo.length; i++)
{
applyTo[i].style.backgroundColor = myColor;
}
return false;
}
}
</script>
<style type="text/css" media="screen">
div { border: 2px solid black;
padding: 5px;
margin: 2px;
background-color: silver;
}
p { border: 1px solid silver;
}
.red { color:red; }
.blue { color:blue; }
.green { color:green; }
</style>
</head>
<body >
<div class="overall" onClick="paintColor(this.tagName,this.className);">
<div class="navi" onClick=" paintColor(this.tagName,this.className);">
<a href="http://www.microsoft.com" onClick="return paintColor(this.tagName,this.className);">Microsoft</a>
<a href="http://www.linux.org" onClick="return paintColor(this.tagName,this.className);">Linux</a>
</div>
<div class="content" onClick="return paintColor(this.tagName,this.className);">
<p onClick="paintColor(this.tagName,this.className);">Lorem Ipsum und so. Absatz 1!</p>
<p onClick="paintColor(this.tagName,this.className);">Lorem Ipsum und so. Absatz 2!</p>
</div>
</div>
<div class="select0r">
<span class="red" onClick="setColor('red');">rot</span>
<span class="blue" onClick="setColor('blue');">blau</span>
<span class="green" onClick="setColor('green');">grün</span>
</div>
</body>
</html>
Problem: Elemente sind "durchsichtig" und dadurch bekommen alle "unterliegenden" Elemente den Event. Der Klick wird durch jedes Elements bis nach oben zum body durchgereicht, und jedes Element tut so, als ob's geklickt wurde.
Solange es also keine Möglichkeit gibt, den Eventfluß abzubrechen.... ;(