<html>
<head>
<style type="text/css">
<!--
.mybutton{
background-color:#efefef;
border:1px solid black;
width:80px;
color:black;
font-size:12px;
font-family:arial;
text-align:center;
padding:3px;
cursor:hand;
}
.mybutton_mouseover{
background-color:silver;
border:1px double black;
width:80px;
color:red;
font-size:12px;
font-family:arial;
text-align:center;
padding:3px;
cursor:hand;
}
-->
</style>
<script type="text/javascript">
<!--
function format(id, way) {
if(way == 'omov'){
document.getElementById(id).className = "mybutton_mouseover";
}
else{
document.getElementById(id).className = "mybutton";
}
}
function gotoUrl(url){
window.open(url,'NeuesFenster');
}
//-->
</script>
</head>
<body>
ohne Hover... <span class="mybutton" onClick="gotoUrl('http://www.tutorials.de');"> tutorials </span>
<br><br>
mit Hover... <span class="mybutton" id="1" onClick="gotoUrl('http://www.tutorials.de');"
onMouseOver="format(this.id, 'omov')" onMouseOut="format(this.id, '')"> tutorials </span>
</body>
</html>