Javascript ist Toll!

aufgleitende Javascript Popups

Das folgende Skript öffnet ein HTML Element mit einer fliessenden Bewegung. Es gleitet auf, anstatt sofort sichtbar zu sein. Dies wird durch die CSS Eigenschaft clip() erreicht. Diese Technik funktioniert nur, wenn das Element absolut positioniert ist

Beschreibung

ClipObjekt(param)

Gibt ein ClipObjekt Popup zurück, der Parameter kann entweder ein String mit der ID des Elementes sein (es findet keine Überprüfung statt) oder das Objekt selbst.

ClipObjekt().open(fix_h, fix_w, step, center, speed)

öffnet das Popupfenster. Die Parameter haben folgende Bedeutung:

• fix_h (bool)
  Das Fenster gleitet nur horizontal auf. Also entweder von Links nach rechts oder mit dem Parameter center, von der Mitte nach links und rechts.
• fix_w(bool)
  Analog wie fix_h nur, dass das Fenster dann vertikal aufgleitet.
• step (int)
  Anzahl der Pixel pro Schritt (default: 4)
• center (bool)
  Ist der Parameter wahr gleitet das Fenster aus der Mitte auf.
• speed (int)
  Millisekunden des Interval (default: 10).

ClipObjekt().isOpen()

Gibt zurück ob das Fenster offen ist oder nicht.

ClipObjekt().show()

zeigt das Fenster in seiner vollen Größe an.

ClipObjekt().hide()

Versteckt das Fenster.

Es werden zwei Events gefeuert- onopen wenn das fenster komplett offen ist und onclose wenn die close() Funktion aufgerufen wird.

Download und Code

Beispiel

In dem Formular können die Parameter für den open() Aufruf geändert werden.

Element ID:   Test 1Test 2
Volle Breite:  
Volle Höhe:   
Center:       
Step:         

dieser Bereich kann mit einem klick geöffnet werden:

onclick="ClipObject(this).open(0, 0, 4, 1);

ID: test1

dieser Bereich kann auch mit einem klick geöffnet werden:

ID: test2

Text