Toggle Script

Ossipower · 28.08.2009

Hi.

Ich würde gern auf meiner Webseite ein Module durch den User ein- und ausblenden lassen.
Es ist das Module mit dem Inhalt "Sie sind nicht eingeloggt."

Das Ausblenden geht, nur das Einblenden klappt nicht.

Code:

window.addEvent('domready', function() {


var mySlide = new Fx.Slide('test');

 
$('toggle').addEvent('click', function(e){
    e = new Event(e);
    mySlide.toggle();
    e.stop();
});
 


});

Wenn das Problem behoben wurde, gibt es eine Möglichkeit, daß der Zustand des Moduls gespeichert wird. z.B. Wenn der User es ausgeblendet hat, daß es dann auch ausgeblendet bleibt bei dem weiteren Besuch auf der Seite. Bis jetzt öffnet sich das Modul wieder, wenn man eine andere Seite anwählt.

Eine weitere Frage hätte ich noch. Wie kann ich dafür sorgen, daß beim offenen Module "Schließen" und beim geschloßenen "Öffnen" steht.

Ich danke euch im vorraus.

Gruß
Ossipower

pgagei · 28.08.2009

AW: Toggle Script

:uhm:Wenn du die Funktionalität erweitern willst, musst du in der Fx-Klasse Änderungen vornehmen.
Die Zustände merkst du dir z.Bsp. über Cookies.
Grüße

Ossipower · 28.08.2009

AW: Toggle Script

bin ein totaler anfänger, kannst du es mir näher erläutern

smdata2 · 28.08.2009

AW: Toggle Script

also ich bin im moment auch mit mootools am experimentieren von daher kann ich dir nur empfehlen dir das beispiel auf nochmal genau anzugucken. eigentlich sollte es richtig funktionieren wenn du es genau so machst wie ich dir hier nochmal in einer beispiel html zeige:

HTML:

<html>
<head>
  <script type="text/javascript" src="mootools.js"></script>
  <script type="text/javascript" src="mootools-more.js"></script>
  <script type="text/javascript">
    window.addEvent('domready', function() {
        var Slide = new Fx.Slide('div_toggle');
        
        $('a_toggle').addEvent('click', function(e) {
            e.stop();
            Slide.toggle();
        });
    });
  </script>
</head>
<body>
  <a id="a_toggle" href="#">Toggle</a><p />
  <div id="div_toggle" style="width: 400px; height: 60px; background: red;">
    Lorem Ipsum dolor sit amet.
  </div>
</body>
</html>

beste grüße
data