hallo zusammen,

gerade nutze ich die sommerferien, um mich mit css3 im detail auseinander zu setzen. als projekt habe ich mir die neugestaltung meiner privaten website vorgenommen. anstatt der herkömmlichen roll-over navi http://www.bernd-scheurer.de soll das jetzt eine minimale navi auf basis einer ausfahrbaren liste werden - was bislang auch ganz gut funkioniert http://www.bernd-scheurer.de/sandbox/

hierbei sind mir aber ein paar interessante dinge aufgefallen:
das neue menü benutzt hover-effekte, transitionen (weiche bewegungen), und verläufe (gradients). im moment teste ich nur unter mac (safari, firefox, opera, chrome), da mein virtuelles windows xp nur über einen IE8 verfügt.

firefox stellt alle programmierten optionen klaglos und perfekt dar. eine wahre freude. ebenso verhält sich das bei chrome.
opera will keine animationen (transitions) darstellen und bei safari war erst mal alles unbrauchbar: keine padding-werte (!? - ist ja keine css3-errungenschaft), keine gradients, keine transitions und keine hover-effekte (?! - auch nicht neu, diese option).

nach längerem suchen und probieren, kam ich dann auf die idee, im entwicklermenü die option "WebGL" zu aktivieren. plötzlich hat alles funktioniert. das wirft nun mehrere fragen auf: obwohl safari traditionell die aktuellen techniken unterstützt, ist WebGL standartmässig deaktiviert und somit css3-techniken auch. wer das nicht weiss, sieht eine deutlich reduzierte seite. warum ist das so? wird sich das ändern? weshalb sind davon auch so rudimentäre dinge wie padding-abstände und hover betroffen?

bei der gelegenheit erfuhr ich auch, dass bei opera WebGL auch standartmässig deaktiviert ist. leider habe ich dort die option zum aktivieren nicht gefunden.

ich würde mich über erfahrungen aus dem forum freuen, weil ich meine seite gerne so gestalten möchte, dass alle in den selben genuss kommen. gerade beim safari irritiert mich diese entdeckung doch sehr...

vielen dank und grüße
bernd

Hallo Bernd!

Das hat mit WebGL nichts zu tun. Wenn das noch aktuell ist, verwendest Du in Deinem CSS nur den Vendor-Präfix für webkit (Safari und Chrome).

Sollte so aussehen, dann berücksichtigst Du alle "moderneren" Browservarianten:

-webkit-transition: all ;
-moz-transition: all ;
-ms-transition: all ;
-o-transition: all ;
transition: all ;

Die Anweisung ohne Präfix kommt immer an Schluss.

LG Jürgen

hallo jürgen,

vielen dank für deine antwort.
ja, komische sache. wie bereits erwähnt, lief das bei safari erst nach der aktivierung von WebGL. mittlerweile tut das auch ohne und ich habe keine ahnung wieso das so war/ist.

überhaupt ist der safari in mancherlei hinsicht etwas nervig. das ausschalten des cache im entwicklermenü muss bei jedem browserstart wieder neu vorgenommen werden. oft wird das löschen auch erst wirksam, wenn man safari beendet und neu startet.

im moment bette ich eine javascript-animation (tumult hype) ein und habe nur bei safari das problem, dass mouse-over-events verschluckt werden. aber eben auch nicht immer. schade eigentlich.
das macht (leider und erschreckenderweise) der IE unter Win8 (parallels) bedeutend stressfreier!

lg
bernd