+ Antworten
Seite 1 von 2 1 2 LetzteLetzte
Ergebnis 1 bis 10 von 13

Thema: Aufklappbarer Inhalt zeigt die Galerie im Beitrag nicht richtig an

  1. #1
    Neu an Board
    Registriert seit
    21.09.2017
    Beiträge
    6
    Bedankte sich
    0
    Erhielt 0 Danksagungen
    in 0 Beiträgen

    Standard Aufklappbarer Inhalt zeigt die Galerie im Beitrag nicht richtig an

    Hallo zusammen,

    zunächst hoffe ich hier im Richtigen Bereich zu sein, aber ich dachte, da es wohl um CSS-Probleme geht passt es am besteh hier her.

    Mein Problem Sieht wie folgt aus:
    Ich Habe eine Hobby-Fotografenseite und ich möchte meine Website aussehen lassen dass alles nur auf einer Seite sich befindet.
    Ich habe für jede Galerie (Themenbezogen) einen Beitrag angelget in dem ich die Galerie anzeigen lasse.
    Hierfür nutze ich die "Gallery Aholic" welche ich als Modulposition einbinden muss in den Beitrag.
    Da es allerdings viele Bilder sind, möchte ich gerne diese zunächst ausblenden, und diese dann wie einen "Spoiler-Text" aufklappen lassen.
    Dazu habe ich sowohl ein Plugin, als auch einen HTML-Code ausprobiert und beides funktioniert nicht richtig.
    Und zwar wir wohl die Größe nicht korrekt übergeben untereinander.
    Da die Galerie sich an der Seitengröße anpasst schrumpft diese auf die größe des minimierten Spoilers zusammen und beim aufklappen wird diese nicht neu berechnet.
    Zusätzlich bleibt der Spoiler klein, da die Galerie ja keine effektive Größe hat.

    Der Code des Beitrages mit Spoiler-Plugin sieht so aus:
    HTML-Code:
    <div style="background-image: url('images/Gallerien/Nature.jpg'); height: 100%; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover;">
    <div style="background-color: rgba(153,153,153,0.8);">
    <h1 id="nature" style="text-align: center;"><span style="color: #ffffff;">Nature</span></h1>
    <p style="text-align: center;"><span style="color: #ffffff;">Mit diesen Fotos m&ouml;chte ich zeigen, wie sch&ouml;n und erhaltenswert die Natur im Ganzen ist, auch wenn Manches auf den ersten Blick nicht "Sch&ouml;n" scheint, so birgt es doch einen sch&ouml;nen Kern.</span></p>
    {spoiler spnat,Anzeigen,Verbergen}
    {loadposition NaturePos}
    {/spoiler}
    </div>
    </div>
    Und der Code des selbst erstellten (Copy&Paste) Spoilers so:
    HTML-Code:
    <div style="background-image: url('images/Gallerien/Architecture.JPG'); height: 100%; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover;">
    <div style="background-color: rgba(153,153,153,0.8);">
    <h1 id="architecture" style="text-align: center;"><span style="color: #ffffff;">Architecture</span></h1>
    <p style="text-align: center;"><span style="color: #ffffff;">Diese Fotos versuchen eine besondere Sicht auf Geb&auml;ude aus Stadt und Land zu legen.</span></p>
    <div class="pre-spoiler">
    <input name="button" type="button" onClick="if (this.parentNode.getElementsByTagName('div')[0].style.display != 'none') { this.parentNode.getElementsByTagName('div')[0].style.display = 'none'; this.value = 'Aufklappen'; } else { this.parentNode.getElementsByTagName('div')[0].style.display = 'block'; this.value = 'Zuklappen';}" value="Buttontext">
    <div class="spoiler" style="display: none;">
    {loadposition ArchitecturePos}
    </div>
    </div>
    </div>
    </div>
    Achja, dass die bilder teilweise im FF nicht korrekt angezeigt werden ist mir bekannt und liegt wohl am "Greyscale" effekt, dafür suche ich dann im nachgang eine lösung.
    Und was auch nett zu wissen ist, ist dass wenn man den Spoiler öffnet während er die Bilder noch läd (dauert ziemlich lange) dass er dann die korrekte Größe für die Galerie ermittelt und man dann den spoiler normal nutzen kann.
    Also gehe ich stark davon aus, dass ich das Ausführen der Größenberechnung für die Galerie nochmal anstoßen müsste nachdem der Spoiler geöffnet wurde.

    Bei der Galerie habe ich auch folgende einstellungen gefunden, hab diese auch schon getestet, scheinen aber nichts zu ändern:


    Ich hoffe ihr könnt mir irgendwie helfen, das wäre spitze!

    LG
    Ralf

    P.S. meine website lautet: http://ralf.risse.website

  2. #2
    Gehört zum Inventar
    Registriert seit
    06.03.2013
    Ort
    /dev/random
    Beiträge
    6.283
    Bedankte sich
    144
    Erhielt 2.365 Danksagungen
    in 2.223 Beiträgen
    Gruß FINWICK
    ↶ Danke Button nutzen, wenn es geholfen hat - Kein Suport via PN

  3. #3
    Neu an Board
    Registriert seit
    21.09.2017
    Beiträge
    6
    Bedankte sich
    0
    Erhielt 0 Danksagungen
    in 0 Beiträgen

    Standard

    Hallo FINWICK,

    Zitat Zitat von FINWICK Beitrag anzeigen
    erstmal danke für deine Idee.

    Wenn ich den Tag
    Code:
    display_on_load="false|true"
    Einfüge dann zeigt er die Galerie an und ich müsste sie aktiv verstecken, allerdings funktioniert dann auch der parralax background den ich mit dem <div> einfüge nichtmehr und streckt sich nicht mit auf die Galerie größe
    Ich möchte halt pro "Beitrag" einen eigenen parralax Hintergrund.

    Und wenn ich den Tag weglasse, dann ist er zu aber das aufklappen zeigt wieder das gleiche problem...
    Dann erkennt er nichtmehr die Richtige Größe der Galerie.

    Ich vermute wie gesagt, dass es daran liegt, dass die Galerie sich an der Displaygröße (bzw. des Containers in dem Sie drinnen ist) auch anpasst, diese aber nur beim Öffnen der seite prüft.
    Das heißt, dass sie bei einem Spoiler der zu ist, eine Breite von 0 annimmt und daher ihre bilder alle in die Breite null schiebt...
    Und beim Öffnen des Spoilers wird die Größe nicht neu berechnet...

    Dass heißt eigentlich wäre ja JPlugger ganz gut, ich müsste dann ja "nur" in ein eigenes php-script reinschreiben, dass er beim öffnen das berechnen der Seitengröße neu ausführt...
    Kennt sich jemand hier mit sowas aus? oder kann man das "neuberechnen" evtl. leichter durchführen?

    Vielen Dank schonmal

    LG
    Ralf

  4. #4
    Gehört zum Inventar
    Registriert seit
    06.03.2013
    Ort
    /dev/random
    Beiträge
    6.283
    Bedankte sich
    144
    Erhielt 2.365 Danksagungen
    in 2.223 Beiträgen

    Standard

    Vielleicht andere Galerie probieren, https://www.jplugger.com/documentati...gs/116-gallery
    Gruß FINWICK
    ↶ Danke Button nutzen, wenn es geholfen hat - Kein Suport via PN

  5. #5
    Neu an Board
    Registriert seit
    21.09.2017
    Beiträge
    6
    Bedankte sich
    0
    Erhielt 0 Danksagungen
    in 0 Beiträgen

    Standard

    Hallo Finwick,

    Zitat Zitat von FINWICK Beitrag anzeigen
    Vielleicht andere Galerie probieren, https://www.jplugger.com/documentati...gs/116-gallery
    Vielen Dank für den Tipp, aber auch das funktioniert nicht... Ich habe zwei bilder in die Galerie gepackt und diese dann in den Spoiler, leider klappt das nicht.
    Also muss es wohl dann doch am Template oder CSS liegen?

    Maaan so langsam wird es echt komisch...

    LG
    Ralf

  6. #6
    Gehört zum Inventar
    Registriert seit
    06.03.2013
    Ort
    /dev/random
    Beiträge
    6.283
    Bedankte sich
    144
    Erhielt 2.365 Danksagungen
    in 2.223 Beiträgen

    Standard

    Wenn ich die Seite versuche in den Debugger zu nehmen, dann lässt sie sich nicht richtig debuggen. Dieses passiert, wenn etwas am Scriptcode nicht stimmt. Schaue ich mir den Quellcode an, so sieht man, dass Scripte mehrmals vorhanden sind und Funktionen definieren. Dieses könnte das Problem sein.
    Stelle es mal auf ein Standard-Template um, um festzustellen ob es am Template liegt.
    Geändert von FINWICK (22.09.2017 um 15:18 Uhr)
    Gruß FINWICK
    ↶ Danke Button nutzen, wenn es geholfen hat - Kein Suport via PN

  7. #7
    Gehört zum Inventar
    Registriert seit
    06.03.2013
    Ort
    /dev/random
    Beiträge
    6.283
    Bedankte sich
    144
    Erhielt 2.365 Danksagungen
    in 2.223 Beiträgen

    Standard

    Nachtrag: Es liegt daran, das die Funktion für die Galerie nur auf Resize Window reagiert und das Rendering startet und nicht auf das Resize des DIV-Containers. Wenn man also nach öffnen des Spoilers die Browsergröße verändert, wird es richtig angezeigt.
    Jetzt musst du rausfinden, was du aufrufen musst, damit es neu gerendert wird.
    Geändert von FINWICK (22.09.2017 um 11:59 Uhr)
    Gruß FINWICK
    ↶ Danke Button nutzen, wenn es geholfen hat - Kein Suport via PN

  8. #8
    Gehört zum Inventar
    Registriert seit
    06.03.2013
    Ort
    /dev/random
    Beiträge
    6.283
    Bedankte sich
    144
    Erhielt 2.365 Danksagungen
    in 2.223 Beiträgen

    Standard

    Wenn du im Spoiler noch code dazufügst
    Code:
    jQuery(".jp-gallery").BalancedGallery({divisor: 8});
    Dann sollte das rendern klappen.

    Im Tag Spoiler den Code-Teil ändern
    Code:
    $code = $code . 'jQuery("#' . $buttonId . '").click(
    function(){
    jQuery("#' . $contentId . '").toggle();
    event.preventDefault();
    });});';
    $jpfunc->addScriptCode($code);
    in
    Code:
    $code = $code . 'jQuery("#' . $buttonId . '").click(
    function(){
    jQuery("#' . $contentId . '").toggle();
    event.preventDefault();
    jQuery(".jp-gallery").BalancedGallery({divisor: 8});
    });});';
    $jpfunc->addScriptCode($code);
    Rot zufügen, dadurch wird das Rendern noch mal angetriggert, zumindest könnte es so funktionieren.

    Wobei in der JavaScript Lib noch einige Fehler drin sind und scheinbar nicht mehr gepflegt, da würde ich eine andere nehmen, wenn es mit dem Code nicht funktioniert.
    Geändert von FINWICK (22.09.2017 um 15:32 Uhr)
    Gruß FINWICK
    ↶ Danke Button nutzen, wenn es geholfen hat - Kein Suport via PN

  9. #9
    Neu an Board
    Registriert seit
    21.09.2017
    Beiträge
    6
    Bedankte sich
    0
    Erhielt 0 Danksagungen
    in 0 Beiträgen

    Standard

    Hallo, entschuldigung dass ich bis jetzt nicht geantwortet habe. Die letzten Tage hatte ich für solche test keine zeit, werde aber die kommenden Tage es versuche umzusetzen.
    Eine Frage noch zum Verständnis, die obere Zeile müsste ich dann direkt in den Beitrag in den HTML-Code einfügen? Oder meinst du in das PHP-Script? Dort dann an eine bestimmte Stelle, oder ist dies egal?

    Danke Dir schonmal für die Mühe!

  10. #10
    Gehört zum Inventar
    Registriert seit
    06.03.2013
    Ort
    /dev/random
    Beiträge
    6.283
    Bedankte sich
    144
    Erhielt 2.365 Danksagungen
    in 2.223 Beiträgen

    Standard

    In den JPlugger Tag das Tag Spoiler ändern.
    Gruß FINWICK
    ↶ Danke Button nutzen, wenn es geholfen hat - Kein Suport via PN

+ Antworten
Seite 1 von 2 1 2 LetzteLetzte

Stichworte

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein