Style-Notation
Wenn in JavaScript eine CSS-Angabe ausgelesen oder verändert werden soll, entfällt der Bindestrich, und der erste Buchstabe des Wortes hinter dem Bindestrich wird großgeschrieben. Muss ich immer mal nachschauen - (mann) kann sich ja nicht alles gleichzeitig merken!
Wenn Style-Eigenschaften über Javascript beeinflusst werden, sollte dies auf Grund von Bedingungen geschehen.
Soll eine Angabe statisch bleiben, braucht es das hier nicht!
Aufgeführt werden Attribute, deren Wertzuweisungen per JavaScript von mir Anwendung finden als auch Erprobungen für meine Spielwiese mit dem Ergebnis, Gefallen daran zu finden oder eine sinnvolle Möglichkeit zu erkennen.
Es wird also keine vollständige Auflistung werden und soll es auch nicht!
| Positionierung und Anzeige | ||
| cssFloat und clear | Im gesamten Projekt ist durch die feste Breite des <main>-Elementes der Einsatz von cssFloat Unsinn, insofern sich da nichts ändert. Eine Simulation veränderlicher Elementbreiten soll dafür ein Ersatz sein, um auf eine eventuelle Notwendigkeit reagieren zu können. Die Box hat das StyleAttribut cssFloat='left'. Adäquat kann auch obj.style.clear="left' für den Text eingesetzt werden. |
größenveränderbar
breit: 212px |
| Transparenz | Abgesehen von oft zitierten und beschriebenen Slideshows habe ich ein weiteres geeignetes Beispiel parat.
In „PHP ► Bilder präsentieren ► Viele Wege Teil2“ wird eine Diareihe per Draggen verschoben, um auch Dias außerhalb des sichtbaren Bereiches erreichen zu können. Je näher die Diareihe dem Ende oder Anfang zu verschoben wird, erhält der entsprechende Richtungspfeil symbolisch einen Transparenzwert. Wenn es nicht mehr weiter in eine Richtung geht, ist der Richtungspfeil völlig durchsichtig und zeigt dies damit an. |
|
| clip vs width / height | Der rechteckige Ausschnitt mit Attribut clip gilt als veraltet, somit sollte die aktuelle Syntax clip-path verwendet werden. Mit clipPath hat man bisher aber nur auf SVG-Elemente Zugriff. Hier funktioniert nur: obj.style.clip = "";
Sinn macht es natürlich nur wieder bei Reaktion auf veränderliche Größen des Elternelementes. Bild und Text teilen sich zur Hälfte die zur Verfügung gestellte Breite der Box. Die augenfällig elegantere Lösung ist die Beeinflussung der tatsächlichen Größe. Wer möchte gern einen Inhalt beschneiden, wenn es anders geht. Mehr noch: um einen Clipping-Effekt zu erreichen, muss das Element absolut positioniert werden. Das schließt wiederum ein Umfließen aus. Es kommt eben darauf an, worauf die Priorität gesetzt werden soll. |
Auf dieser rechten Seite wird nur erklärt, was passiert wenn: ?
|
| Hier suche ich noch nach geeigneten Beispielen. | ||