Elemente über CSS verschieben
18. Apr 2013
Zum nachträglichen Verschieben von Elementen nutzt man gewöhnlich JavaScript. Die wichtigsten Funktionen stehen Ihnen nun auch direkt über CSS zur Verfügung.
Mit CSS können Sie ab sofort auch Elemente verschieben. Die CSS-JavaScript Schnittstelle ui.js bietet dafür vier unterschiedliche Funktionen an.
Mit dieser Möglichkeit lassen sich weitergehende Anpassungen durchführen, ohne dazu zusätzlich JavaScript anpassen zu müssen. Layout-Varianten, welche eine angepasste HTML-Struktur benötigen sind rein über CSS umsetzbar, da die DOM-Manipulation direkt im CSS definiert wird.
Unterstützte CSS-Only DOM-Manipulationen sind derzeit:
- -w-dom-prependto - Fügt das Element als erste Unterelement ein
- -w-dom-appendto - Fügt das Element als letztes Unterelement ein
- -w-dom-insertbefore - Fügt das Element davor ein
- -w-dom-insertafter - Fügt das Element danach ein
Verschieben eines Elementes über jQuery
jQuery('.listBannerSlider_var25').prependTo("#blockBeforeLeftContentRight");
Verschieben eines Elementes über CSS
.listBannerSlider_var25 {-w-dom-prependto:#blockBeforeLeftContentRight;...In beiden Fällen wird das über den Selektor definierte Element über JavaScript verschoben. Im ersten Beispiel geschieht das Verschieben direkt über jQuery. Im zweiten Beispiel wird das Verschieben über CSS gesteuert von der ui.js ausgeführt.