Ergebnis 1 bis 2 von 2

Thema: contao accordeon jquery - vorheriges offen bleiben, wenn man nächstes anklickt-gelöst

  1. #1
    Contao-Nutzer
    Registriert seit
    19.07.2011.
    Beiträge
    79

    Standard contao accordeon jquery - vorheriges offen bleiben, wenn man nächstes anklickt-gelöst

    liebe contaoleute,

    diesmal eine ganz andere frage zum accordeon:

    am anfang sollen alle geschlossen sein (die übliche frage).
    bei klick auf den pfeil aufgehen, klar.
    aber wenn man den nächsten toggler anklickt soll der alte NICHT automatisch schliessen, sondern offen bleiben.
    am bester wäre es er schließt nur, wenn man den toggler manuell anklickt.

    den kunden stört nämlich das hektische hin- und herscrollen beim öffnen und (automatischen) schließen.
    hier der normale code:

    <script src="<?= TL_ASSETS_URL ?>assets/jquery/ui/<?= $GLOBALS['TL_ASSETS']['JQUERY_UI'] ?>/jquery-ui.min.js"></script>
    <script>
    (function($) {
    $(document).ready(function() {
    $(document).accordion({
    // Put custom options here
    heightStyle: 'content',
    header: 'div.toggler',
    collapsible: true,
    active: true,
    create: function(event, ui) {
    ui.header.addClass('active');
    $('div.toggler').attr('tabindex', 0);
    },
    activate: function(event, ui) {
    ui.newHeader.addClass('active');
    ui.oldHeader.removeClass('active');
    $('div.toggler').attr('tabindex', 0);
    }
    });
    });
    })(jQuery);
    </script>



    vielen dank für etwaige hilfe,

    oliver grosche
    Geändert von oligro (23.03.2017 um 13:08 Uhr)

  2. #2
    Contao-Nutzer
    Registriert seit
    19.07.2011.
    Beiträge
    79

    Standard ich habs selbst rausgefunden

    man muss einfach in der j_accordion.html5 nach dem active: false folgenden code einfügen:

    beforeActivate: function(event, ui) {
    // The accordion believes a panel is being opened
    if (ui.newHeader[0]) {
    var currHeader = ui.newHeader;
    var currContent = currHeader.next('.ui-accordion-content');
    // The accordion believes a panel is being closed
    } else {
    var currHeader = ui.oldHeader;
    var currContent = currHeader.next('.ui-accordion-content');
    }
    // Since we've changed the default behavior, this detects the actual status
    var isPanelSelected = currHeader.attr('aria-selected') == 'true';

    // Toggle the panel's header
    currHeader.toggleClass('ui-corner-all',isPanelSelected).toggleClass('accordion-header-active ui-state-active ui-corner-top',!isPanelSelected).attr('aria-selected',((!isPanelSelected).toString()));

    // Toggle the panel's icon
    currHeader.children('.ui-icon').toggleClass('ui-icon-triangle-1-e',isPanelSelected).toggleClass('ui-icon-triangle-1-s',!isPanelSelected);

    // Toggle the panel's content
    currContent.toggleClass('accordion-content-active',!isPanelSelected)
    if (isPanelSelected) { currContent.slideUp(); } else { currContent.slideDown(); }

    return false; // Cancels the default action
    },


    gefunden auf http://stackoverflow.com/questions/3...-sections-open

Aktive Benutzer

Aktive Benutzer

Aktive Benutzer in diesem Thema: 1 (Registrierte Benutzer: 0, Gäste: 1)

Lesezeichen

Lesezeichen

Berechtigungen

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