Auflösungsabhängiges Template

[Diamantium]

Hallo,

ich habe mir mittlerweile bei diesem Thema die Zähne ausgebissen. Ich möchte gerne meinen Shop auf Version 1.06 aktualisieren. Dabei wollte ich gleich mein altes yaml Template auf eine flexible Content-Spalte umstellen. Bisher ist mir das auch recht gut gelungen. Nun habe ich im Kopf bei maximaler Auflösung ziemlich viel Platz. Hier wollte ich nun auflösungsabhängige Elemente platzieren. Da das ganze wohl nur mit Javascript funktioniert, hab ich schon etliches probiert, aber leider ohne Erfolg. Hier mein am nächsten liegende Variante:

Code: Javascript  [Auswählen]

<script type="text/javascript">
var winX = window.innerWidth;
if (winX >= 1024) {
document.write( '<img src="/templates/ybt-xt-0013-hs-neutral/img/layout/oz_bgd.png" width="179" height="100" id="oz_bgd" />' ) ;
}
</script>

Er prüft in diesem Fall einmalig beim Laden, welche Auflösung das Browserfenster hat. Ich habe den Code in die general.js.php gepackt. Die Ausgabe funktioniert auch, aber mein Template ist verschachtelt aufgebaut, sodass "document.write" direkt zu Beginn des Bodys eingebaut wird. Weiß jemand wie ich ihn an ein bestimmtes Div hängen kann? Oder gibt es vielleicht eine besser Lösung um die Auflösung abzufragen?

Danke!
Christoph

Linkback: https://www.modified-shop.org/forum/index.php?topic=25673.0

[Matt]

Ich glaube, du suchst media queries.