Gunnar Bittersmann: Dynamischer Effekt mit BGCOLOR

Beitrag lesen

SELF-Forum

Dynamischer Effekt mit BGCOLOR

Gunnar Bittersmann Homepage des Autors
– Informationen zu den Bewertungsregeln

@@Gutefrage?:

nuqneH

Geht das mit den heutigen Browsern auch noch oder setzen diese die BGCOLOR nur einmal?

Heutige Webentwickler geben Darstellungsangaben nicht mittels missbilligter HTML-Attribute an, sondern per CSS.

Besonders interessant ist hier das CSS Transitions Module Level 3 [CSS3-TRANSITIONS].

In Webkits (Safari, Chrome) geht das schon:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">  
<html xmlns="http://www.w3.org/1999/xhtml">  
    <head>  
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>  
        <title>TEST</title>  
        <style type="text/css">  
[code lang=css]body  
{  
    background-color: black;  
    transition-property: background-color;      /* wird noch nicht verwendet */  
    transition-duration: 5s;                    /* wird noch nicht verwendet */  
    -moz-transition-property: background-color; /* wird noch nicht verwendet (Firefox 3.5.6) */  
    -moz-transition-duration: 5s;               /* wird noch nicht verwendet (Firefox 3.5.6) */  
    -ms-transition-property: background-color;  /* wird noch nicht verwendet (IE 8) */  
    -ms-transition-duration: 5s;                /* wird noch nicht verwendet (IE 8) */  
    -o-transition-property: background-color;   /* wird noch nicht verwendet (Opera 10.10) */  
    -o-transition-duration: 5s;                 /* wird noch nicht verwendet (Opera 10.10) */  
    -webkit-transition-property: background-color;  
    -webkit-transition-duration: 3s;  
}

</style>
    </head>
    <body>
        <script type="text/javascript">
//[code lang=xml]<![CDATA[
window.onload = function ()
{
    document.body.style.backgroundColor = "white";
}
//]]>[/code]
        </script>
    </body>
</html>[/code]

Für IE könnte man sicher mit dessen proprietären Filtern was basteln oder per JavaScript als CSS-Expression.

Für Firefox und Opera per JavaScript. Oder auf neuere Versionen warten.

Qapla'

--
Alle Menschen sind klug. Die einen vorher, die anderen nachher. (John Steinbeck)
Beitrag melden
–
Informationen zu den Bewertungsregeln