Ankündigung

Einklappen
Keine Ankündigung bisher.

Website springt mit Masonry Gallerie

Einklappen
X
 
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • Website springt mit Masonry Gallerie

    Hallo zusammen,

    ich bin am verzweifeln, wie wahrscheinlich viele Leidensgenossen hier im Forum.
    Um ehrlich zu sein bin ich weit weg von einem Programmierer, aber bis dato konnte ich alle Probleme selbst lösen.
    Ich habe das Problem, dass die Website http://test.event-loft.de "springt", wenn man die Seite unterhalb der Module aktualisiert oder eine direkte section-id unterhalb der Module aufgerufen wird.
    Mittlerweile weiß ich, dass es an den neun Bildern der Masonry Gallerie liegt und habe das versucht via Preloader zu fixen, aber das hat leider auch nicht geklappt.
    Hat vielleicht irgendjemand eine Idee, wie man das "Hüpfen" beseitigen könnte?
    Ich bin über jede Hilfe sehr dankbar.

    Viele Grüße,
    Kikaba

  • #2
    Hallo,

    es liegt daran, dass für die Bilder keine Größe definiert ist und der Browser nicht weis wieviel Platz er für die Bilder reservieren muss. Deshalb weis der Browser erst nach dem Laden der Bilder wieviel Platz er braucht und verschiebt den Inhalt entsprechend.

    Da mit mehreren CSS- und einer Bootstrap-CSS-Datei gearbeitet wird, mal auf die CSS-Experten warten.

    daniel5959
    FindeLinks.de - Kurzinfos mit Linkempfehlung
    Homepage-FAQs.de - bleibt als Archiv online

    Kommentar


    • #3
      Hallo Daniel,

      vielen Dank für deine schnelle Antwort. Klingt soweit schlüssig und logisch. Ich befürchte, dass dafür meine css Kenntnisse nicht reichen werden.
      Mal sehen, vielleicht hat ja einer der CSS Experten einen guten Tipp
      Danke nochmals!

      VG Kikaba

      Kommentar


      • #4
        Ich könnte mir als Lösung folgendes vorstellen: Masonry hat ein Event "layoutComplete". Das könnte man benutzen, um die Höhe des umgebenden Containers im Localstorage zu speichern. Dann sofort beim Neuladen den Wert wieder auslesen und die Höhe des Containers einstellen. Müsste man versuchen, unklar ist, ob Masonry selber etwas mit der Höhe macht, das einem da in die Quere kommen könnte. Auch dann könnte es eine Lösung geben, indem man einen zusätzlichen Container darum herum legt, der von Masonry nicht beeinflusst wird.

        Kommentar


        • #5
          Vielen Dank auch für deinen Denkanstoß, aber ich befürchte das übersteigt meinen Horizont
          Klingt alles relativ kompliziert. Ich hatte gehofft mit einem min-height oder irgendetwas das Problem gelöst bekomme, aber....
          Trotzdem Danke euch beiden für die Mithilfe und die Ansätze!

          VG Kikaba

          Kommentar


          • #6
            hallo,
            bin mal auf die Seite gegangen,mir sind noch 2 Sachen aufgefallen.
            Die Site hat kein Sicherheitszertifikat, die mit https:angezeigt wird, du hast noch http:
            Das sollte nach dem Test umgestellt werden.
            Außerdem wird ein Warnmeldung bei meinem Browser angezeigt, wegen einem automatischen TON auf der Seite,
            ich habe den Ton ausgeschaltet.

            Neben den von arnego vermutlich nicht definierten Bildgrößen die man unter css einstellen kann,
            sieht es so aus, dass der Platz auf der Site ggf. nicht ausreicht und er das unten runter schiebt.
            probiere einfach mal zum test es mit weniger bilder zu machen und schaue was dann passiert.
            dann könntest du ja die seitenlänge ggf. in der höhe anpassen.

            Ein Möglichkeit ist auch, die Bilder mit einem Bildbearbeitungsprogramm mal vom Format etwas kleiner zu machen.

            Da hilft auch mal etwas auszuprobieren.


            viele Grüße
            Gerhard

            Kommentar


            • #7
              Zitat von ST747 Beitrag anzeigen
              Neben den von arnego vermutlich nicht definierten Bildgrößen
              Die Blumen gebühren daniel5959
              https://arnego2.com <Webseiten, Umbau ab €80 und einiges mehr>

              VPS 8GB RAM 50 GB ROM < Server in der EU, 1rstes Jahr €37

              Kommentar


              • #8
                Vielen Dank auch euch beiden für die Mithilfe.

                @ST747: Das Sicherheitszertifikat kommt sobald die Website fertig ist und online geht
                Der Ton ist in dem virutellen Rundgang hinterlegt. Sollte aber eigentlich nicht automatisch starten, wenn man nicht den Rundgang macht. Schaue ich mir nochmal an.

                Ansonsten habe ich zur Behebung des eigentlichen Problems folgendes gemacht:
                In CSS die Klasse eingefügt:
                Code:
                .masonry-height {
                min-height: 1202px
                }
                Und dem Container von der Masonry Gallerie entsprechend die Klasse zugeorndet:
                Code:
                <div class="row masonry masonryFlyIn masonry-height">
                Es scheint zu gehen, aber ob das wirklich noch responsiv ist wage ich zu bezweifeln...
                Muss das jetzt erst mal ausgiebig testen...

                VG Kikaba

                Kommentar

                homepage-forum.de - Hilfe für Webmaster! Statistiken

                Einklappen

                Themen: 56.712   Beiträge: 429.186   Mitglieder: 28.473   Aktive Mitglieder: 45
                Willkommen an unser neuestes Mitglied, hautarztpraxisreytan.

                Online-Benutzer

                Einklappen

                168 Benutzer sind jetzt online. Registrierte Benutzer: 0, Gäste: 168.

                Mit 3.502 Benutzern waren am 23.01.2020 um 17:20 die meisten Benutzer gleichzeitig online.

                Die neuesten Themen

                Einklappen

                Die neuesten Beiträge

                Einklappen

                • AGW
                  welches Webmail
                  Hallo,

                  ich nutze gerade Roundcube, aber irgendwie würde ich gerne ein anderes Webmail nutzen, nur welches? Könnt ihr welche empfehlen? Natürlich kostenlos.
                  21.10.2020, 14:04
                • arnego2
                  Antwort auf welches Webmail
                  Ist eigentlich egal welche App du nutzt wenn du ein Email Programm nutzt wie Thunderbird, Outlook....
                  Gestern, 20:18
                • Localfu
                  Adobe Flash umbenennen
                  Da Adobe den Flashplayer ab 31. Dezember nicht mehr zur verfügung stellt, könnte man überlegen, dass man diese Sparte umbenennt. Mein Vorschlag wäre HTML5 Animation und Video.
                  Gestern, 18:17
                • silent
                  Diashow
                  Guten Tag,
                  ich möchte in meiner rechten Div ein Informations-Panal hinzufügen, welches man mit Bildern jederzeit updaten kann. Die Bilder sollen per Diashow angezeigt werden. Das funktioniert auch alles reibungslos. Mein Problem ist es, das ich das nicht hinbekomme, dass sich die Bilder automatisch...
                  20.10.2020, 09:13
                • daniel5959
                  Antwort auf Diashow
                  Hallo,

                  ich muss da aussteigen - betrifft auch gesendete Nachricht an mich - und es den CSS-, JS und PHP-Experten überlassen.

                  daniel5959
                  Gestern, 15:03
                • silent
                  Antwort auf Diashow
                  Update:

                  Ich bin mittlerweile soweit, dass ich die Inhalte automatisch aus dem Ordner beziehen kann. Nach den empfehlungen von Sempervivum und eigener recherche, bin ich soweit, dass ich das versuchen werde, mit Javascript zu verwirklichen (automatische Diashow).


                  Code...
                  Gestern, 14:56
                • Hadrian9393
                  Loginscript funktioniert nicht
                  Hallo PHP- und SQL-Profis,

                  ich habe ein Loginscript getestet, dieses funktioniert allerdings nicht wie gewünscht.

                  <?php
                  session_start();
                  $pdo = new PDO("mysql:host=localhost;dbname=php-einfach", "root", "");
                  ?>
                  <!DOCTYPE...
                  28.09.2020, 17:55
                • Hadrian9393
                  Antwort auf Loginscript funktioniert nicht
                  Vielen Dank für die Hilfe, ich werde die Lösungsvorschläge umsetzen.
                  21.10.2020, 19:39
                • Sempervivum
                  Antwort auf Diashow
                  Guten Morgen silent, ich hatte die Lösung schon gepostet, aber das Forum hier hat einen Spamfilter und der hat dieses Posting zunächst gesperrt. Vermutlich weil zwei Links darin waren. Es muss von einem Moderator/Admin erst frei gegeben werden. Ich versuche es Mal ohne Links per privater Nachricht...
                  21.10.2020, 07:45
                • silent
                  Antwort auf Diashow
                  Guten Morgen Sempervivum ,
                  wie meinst du das?
                  Du musst mir ja nicht die Lösung direkt sagen, du könntest mich auch einfach auf den richtigen Weg bringen.

                  VG
                  21.10.2020, 07:36
                Lädt...
                X