Ankündigung

Einklappen
Keine Ankündigung bisher.

Accordeon soll geöffnet bleiben

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

  • Accordeon soll geöffnet bleiben

    Moin Zusammen,

    ich habe eine Menüstruktur in ein paar Akkordeons untergebracht. Diese sind beim Seitenaufruf geschlossen.
    Jetzt soll jedoch ein geöffnetes Accordeon nach dem ersten Öffnen solange offen bleiben, biss der Nutzer es schließt. oder ein anders geöffnet wird.
    Qusi um immer die gewünschten Menüeinträge zu sehen.

    Hat jemand eine Idee?

    Grüße

    Klicke auf die Grafik für eine vergrößerte Ansicht

Name: Screenshot 2022-12-10 133057.jpg
Ansichten: 372
Größe: 104,6 KB
ID: 26352
    https://www.webdesign24.biz

  • #2
    Hi,
    dafür muss man Einzel-Instanzen erstellen lassen.

    Sagen wir mal wir wollen alle Akkordion-Einzelelemente getrennt gesteuert (Einzel-Instanz) und die anderen (Umschläge) wie gehabt.

    j_accordion (EX >= 4.2)

    Code:
    <?php
    
    $GLOBALS['SEO_SCRIPTS_FILE'][] = $this->asset('js/jquery-ui.min.js', 'contao-components/jquery-ui');
    
    ?>
    
    <!-- SEO-SCRIPT-START -->
    
    <script>
    
      jQuery(function($) {
    
        jQuery(document).accordion({
    
          // Put custom options here
    
          heightStyle: 'content',
    
          header: '.ce_accordionStart .toggler',
    
          collapsible: true,
    
          active: false,
    
          create: function(event, ui) {
    
            ui.header.addClass('active');
    
            jQuery('.toggler').attr('tabindex', 0);
    
          },
    
          activate: function(event, ui) {
    
            ui.newHeader.addClass('active');
    
            ui.oldHeader.removeClass('active');
    
            jQuery('.toggler').attr('tabindex', 0);
    
          }
    
        });
    
      });
    
    </script>
    
    
    
    
    <script>
    
    jQuery(document).ready(function()
    
    {
    
    jQuery('.ce_accordionSingle').accordion(
    
    {
    
    heightStyle: 'content',
    
    collapsible: true,
    
    active: false,
    
    create: function(event, ui) {
    
            ui.header.addClass('active');
    
            jQuery('.toggler').attr('tabindex', 0);
    
          },
    
          activate: function(event, ui) {
    
            ui.newHeader.addClass('active');
    
            ui.oldHeader.removeClass('active');
    
            jQuery('.toggler').attr('tabindex', 0);
    
          }
    
    });
    
    });
    
    </script>
    
    <!-- SEO-SCRIPT-STOP -->
    Angehängte Dateien
    Zuletzt geändert von Tim; 10.12.2022, 13:00.
    http://www.premium-contao-themes.com

    Kommentar


    • #3
      Moin Tim,

      vielen Dank.

      Das mit den Einzelelementen funktioniert sehr gut, solange man auf einer Seite bleibt. Für die Akkordeon Umschläge hab ich es auch hinbekommen.
      Bei einem Seitenwechsel - und das ist bei mir wichtig - klappen die Akkordeons leider wieder zu.

      Ich bräuchte also die von Dir gebaute Funktion so, dass sie bei einem Seitenwechsel wirksam bleiben.

      VG
      tschero
      Zuletzt geändert von tschero; 11.12.2022, 09:54.
      https://www.webdesign24.biz

      Kommentar


      • #4
        Zitat von tschero Beitrag anzeigen
        Moin Tim,

        vielen Dank.

        Das mit den Einzelelementen funktioniert sehr gut, solange man auf einer Seite bleibt. Für die Akkordeon Umschläge hab ich es auch hinbekommen.
        Bei einem Seitenwechsel - und das ist bei mir wichtig - klappen die Akkordeons leider wieder zu.

        Ich bräuchte also die von Dir gebaute Funktion so, dass sie bei einem Seitenwechsel wirksam bleiben.

        VG
        tschero
        Das geht nur mit Zwischenspeicherung in einem Cookie/Lokalstorage.
        http://www.premium-contao-themes.com

        Kommentar


        • #5
          Ja, da hatte ich auch schn drüber nachgedacht.
          ich weiß aber nicht so genau, wie ich das umsetzen kann.

          Für ein Feature-Request in EX sehe ich das als zu speziell an.

          Mag jemand mithelfen das zu entwickeln? Ggf. gg. Bezahlung?

          Grüße
          https://www.webdesign24.biz

          Kommentar


          • #6
            Das kann man gut dann im Akoordion Template verbauen. Die Single-Funktion aus dem j_accordion dann wieder löschen.

            Ich habs dir mal in einem angepasstes ce_accodionSingle Template gepackt. (im Element noch auswählen)

            DSGVO: Der localStorage Key heisst: ce_accordionSingle_ID-DES-ELEMENTS (wird gelöscht, wenn Element geschlossen)
            Angehängte Dateien
            Zuletzt geändert von Tim; 12.12.2022, 09:20.
            http://www.premium-contao-themes.com

            Kommentar


            • #7
              Servus, Download ist leider nicht möglich (ungültige Datei angegeben).

              Grüße
              https://www.webdesign24.biz

              Kommentar


              • #8
                Ich hab die Datei nochmal angehangen. Probier nochmal.
                http://www.premium-contao-themes.com

                Kommentar


                • #9
                  Moin,

                  jetzt hat der Download geklappt.
                  Ich probiere das nachher gleich mal aus.

                  Vielen Dank schon mal für die Mühe und Hilfe.

                  Grüße
                  https://www.webdesign24.biz

                  Kommentar


                  • #10
                    Wenn ich es richtig verstanden habe, muss das neue Template im Verzeichnis Templates liegen.
                    Allerdings kann ich es dem Inhaltselement "Umschlag Anfang" nicht zuweisen.

                    Muss das Template in die Themetemplates gelegt werden?

                    Grüße

                    Klicke auf die Grafik für eine vergrößerte Ansicht  Name: templates.png Ansichten: 0 Größe: 49,2 KB ID: 26417

                    Klicke auf die Grafik für eine vergrößerte Ansicht  Name: ie_auswahl_template.png Ansichten: 0 Größe: 133,1 KB ID: 26418
                    https://www.webdesign24.biz

                    Kommentar


                    • #11
                      Das Template ist für das Akkordeon Einzelelement.
                      http://www.premium-contao-themes.com

                      Kommentar


                      • #12
                        Hab alles eingebaut und die Umschläge durch Einzelelemente ersetzt.
                        Klappt alles wunderbar.

                        Vielen Dank für die Hilfe.

                        Grüße
                        https://www.webdesign24.biz

                        Kommentar

                        Lädt...
                        X