nicht angemeldet
Dann gibt es vermutlich zu dem Zeitpunkt, wo du dein Script ausführen lässt, das Element auf das du zugreifen willst, noch gar nicht.
Das hatte ich getestet, daran liegt es nicht, es gibt auch keine Fehlermeldung. Außerdem wird das Element ja verändert.
Nachdem Klaus die Idee mit dem timer anbrachte habe ich mal getestet:
<html>
<head>
<style type="text/css">
.balken_yellow_preload {
height:20px;
width:20px;
overflow:hidden;
background: rgb(255,255,0);
transition: width .5s linear;
-moz-transition: width .5s linear; /* Firefox 4 */
-webkit-transition: width .5s linear; /* Safari and Chrome */
-o-transition: width .5s linear; /* Opera */
}
/* #balken_yellow:hover {
width:140px;
}*/
.balken_yellow_load {
height:20px;
width:140px;
overflow:hidden;
background: rgb(255,255,0);
transition: width .5s linear;
-moz-transition: width .5s linear; /* Firefox 4 */
-webkit-transition: width .5s linear; /* Safari and Chrome */
-o-transition: width .5s linear; /* Opera */
}
</style>
</head>
<body>
<div id="balken_yellow" class="balken_yellow_preload" onmouseover="this.style.width='140px'" onmouseout="this.style.width='10px'">Balken</div>
</body>
<script type="text/javascript">
window.setTimeout("start()", 1); // unzuverlässig mit 0
function start() {
// document.getElementById('balken_yellow').style.width='140px';
document.getElementById('balken_yellow').setAttribute('class','balken_yellow_load');
// beide Varianten gehen!
}
</script>
</html>