Ergebnis 1 bis 6 von 6

Thema: Accordion öffnen mit Javascript Link

  1. #1
    Contao-Nutzer
    Registriert seit
    08.03.2010.
    Beiträge
    105

    Standard Accordion öffnen mit Javascript Link

    Möchte ein Accordion öffnen von einer anderen Position einer Seite.
    Habe schon einige Threads zu diesem Thema gefunden. Folgendes war sehr hilfreich:

    http://www.contao.org/board/topic/2238.html

    Besonders die Lösung mit dem Javascriptlink:
    <a onclick="Accord.accordion.display(4)" href="javascript: return true">LINK</a>

    Das ist es genau und funktioniert grundsätzlich, leider verhält sich dann das Accordion auch seltsam. Klappt 2 mal auf usw. Ich denke es liegt daran dass das Accordion 2 mal aufgerufen wird. Bin leider nicht so gut in Javascript, vielleicht könnte mir jemand sagen wie man den folgenden Code verbessert bzw. kombiniert und der Link oben noch funktioniert:

    Code:
    //Code für den Javascriptlink
    
    var Accord = { 
    	init: function(){
    		this.accordion = new Accordion($$('div.toggler'), $$('div.accordion'));
    	}
    }
    window.addEvent('domready', Accord.init.bind(Accord));
    
    
    //Normale Accordiondefinition
    
    window.addEvent('domready', function() {
      new Accordion($$('div.toggler'), $$('div.accordion'), {
        alwaysHide: true,
        opacity: false,
      //display: -1, // -1, alle Akkordions sind am Anfang eingeklappt
        onActive: function(toggler,elem) {
    		toggler.addClass('active');
           },
    
        onBackground: function(toggler,elem) {
    		toggler.removeClass('active');
           }
      });
      $$('div.toggler').each(function(elem){
    	elem.addEvents({
    		'mouseenter': function(){
    			elem.addClass('hover');
    		},
    		'mouseleave': function(){
    			elem.removeClass('hover');
    		}
    	});
      });
    });
    Danke im Voraus!

    cheche
    Geändert von cheche (10.02.2011 um 10:45 Uhr)

  2. #2
    Contao-Nutzer
    Registriert seit
    08.03.2010.
    Beiträge
    105

    Standard

    Poste hier selber gleich die Lösung. Kann sicher wer brauchen ;-)

    Code:
    // Accordion
    
    var Accord = { 
    	init: function(){
    	this.accordion = new Accordion($$('div.toggler'), $$('div.accordion'), {
        display: <?php 
    	$aid=$_GET[id];
        if  ($aid== '') {
        echo "-1";
        }
        else {
        echo $aid;
        }
        ?>,
        alwaysHide: true,
        opacity: false,
    
    onActive: function(toggler,elem) {
    		toggler.addClass('active');
           },
    
        onBackground: function(toggler,elem) {
    		toggler.removeClass('active');
           }
      });
    $$('div.toggler').each(function(elem){
    	elem.addEvents({
    		'mouseenter': function(){
    			elem.addClass('hover');
    		},
    		'mouseleave': function(){
    			elem.removeClass('hover');
    		}
    	});
      });
    	}
    }
    window.addEvent('domready', Accord.init.bind(Accord));
    Hier der Aufruf von einem Textlink:
    <a onclick="Accord.accordion.display(4)" href="javascript: return true">Link</a>

    Die Nummer in der Klammer display(4) ist die Accordion id (Beginnt bei 0)

    Viel Spaß!

    cheche

  3. #3
    Contao-Fan Avatar von operatorone
    Registriert seit
    19.06.2009.
    Ort
    Kitzingen
    Beiträge
    547

    Standard

    Hi cheche,

    funktioniert das auch mit einem j_accordion oder nur mit mootools?

    Viele Grüße,
    operatorone

  4. #4
    Contao-Nutzer
    Registriert seit
    08.03.2010.
    Beiträge
    105

    Standard

    Kann ich dir leider nicht so sagen. kenn das j_accordion nicht, aber ich könnte mir vorstellen dass es an die Gegebenheiten angepasst grundsätzlich funktionieren kann.
    Bin leider nicht der javascriptexperte ... eher javascriptbastler ;-)
    cheche

  5. #5
    Contao-Nutzer
    Registriert seit
    28.01.2011.
    Ort
    Winterthur, Schweiz
    Beiträge
    169

    Standard

    Hallo Cheche

    Bei mir funktioniert das irgendwie nicht.
    Habe im Layout moo_accordion aktiviert und im Feld "Eigener Javascript-Code" deinen Code reinkopiert.
    Dann im Textelement deinen Link-Code mit ID="0" eingegeben:
    <a onclick="Accord.accordion.display(0)" href="javascript: return true">LINK</a>
    Und ja, es hat mehrere normale Mootools-Accordions auf der selben Seite

    Was mache ich falsch?

    Beste Grüsse
    Nick

  6. #6
    Contao-Nutzer
    Registriert seit
    08.03.2010.
    Beiträge
    105

    Standard

    mmhh ...gute Frage. Ist schon eine Weile her! Seit 2011 hat sich viel getan und es gab es schon einige Updates usw... probier mal andere id's
    Schicke eventuell mal einene Link zu einer Testseite.
    lg cheche

Aktive Benutzer

Aktive Benutzer

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

Ähnliche Themen

  1. Antworten: 35
    Letzter Beitrag: 27.09.2017, 18:39
  2. MooTools Accordion zweites öffnen ohne das erstes schließt
    Von mo2402 im Forum Allgemeine Inhaltselemente
    Antworten: 9
    Letzter Beitrag: 18.02.2015, 12:54
  3. Link in Accordion
    Von Javahe im Forum Layout / Templates / Holy Grail
    Antworten: 0
    Letzter Beitrag: 02.01.2011, 18:11
  4. mootools accordion per id ansprechen und öffnen
    Von aportmann im Forum Layout / Templates / Holy Grail
    Antworten: 6
    Letzter Beitrag: 16.11.2010, 09:09

Lesezeichen

Lesezeichen

Berechtigungen

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