Script soll erst bei definierter Fensterbreite ausgeführt werden

  • Hallo zusammen,


    ich habe mir von blog.kulturbanause.de ein jQuery-Script kopiert, dessen Aufgabe es ist, gleiche Elemente an der Höhe des höchsten Elements ausrichten. Das funktioniert wunderbar. Hier das Script:



    Nun hätte ich aber gern, dass dieses Script erst ab einer Fensterbreite (Dokumentenbreite?) von 768 px seinen Dienst tut - bei schmalerer Darstellung sollte es ingoriert werden. Allerdings sind meine JS-Kenntnisse knapp über null - ich weiß lediglich, dass man mit JS Bedingungen von Fenstern und Bildschirmen abfragen kann (z. B. window.innerWidth), aber wie man das in eine Funktion bringt, die mein o. g. Script ausführt oder eben halt nicht, davon habe ich keine Ahnung.


    Wäre jemand so freundlich, das mit mir gemeinsam zu erarbeiten? Allein und nur mit Googles Hilfe kriege ich es nicht hin.


    Danke und Gruß

    Felix

  • Diese Aufgabe kann man heute viel leichter mit CSS und Flexlayout lösen. Dabei kann man auch die Darstellung mit einer Mediaquery abhängig von der Fensterbreite einfach umschalten:

  • Sempervivum Herzlichen Dank für die schnelle Antwort! Und wieder habe ich etwas gelernt. Der CSS-Code ist schon in mein Projekt eingebaut und funktioniert prima. :)


    Obwohl sich mein ursprüngliches Anliegen damit zunächst erledigt hat, würde mich die Lösung immer noch interessieren - einfach, um etwas für eventuelle spätere Anforderungen zu lernen. Also, falls jemand die Zeit, Geduld und Lust hat, es zu erläutern, würde ich mich sehr freuen.

  • Ich habe noch ein wenig gegoogelt und bin auf dieser Seite fündig geworden: https://dzone.com/articles/checking-media-queries-jquery (ganz unten)


    Daraus ist jetzt dieses Script entstanden:



    Die Anpassung von ".teaser" greift also erst, wenn der Viewport mindestens 768 px breit ist. Die Neuberechnung, wenn die Größe des Browserfensters verändert wird, funktioniert dabei allerdings nicht mehr. Na ja, nicht so schlimm ...


    Für mein Projekt bleibe ich aber bei der CSS-Lösung Flexbox und muss mich dringend eingehender mit diesem Modul beschäftigen.

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!