Einfache Akkordeon mit der Klasse USimpleTabStrip

Mittwoch, 20. August 2008

Die Klasse USimpleTabStrip vorgelegt Einfache unaufdringlich TabStrip, kann auch verwendet werden, um ein einfaches Menü Akkordeon.
Mit den Auswirkungen der BlindUp() und BlindDown() von scriptaculous:

Plain Text
JavaScript:
  1. Funktion init () (
  2. ; UTS = new USimpleTabStrip ();
  3. ; UTS. Init ();
  4. ( e ) { UTS. OnShow = function (e) (
  5. ( e ) ; neuen Effekt. BlindDown (e);
  6. )
  7. ( e ) { UTS. OnHide = function (e) (
  8. ( e ) ; neuen Effekt. BlindUp (e);
  9. )
  10. )

E Neupositionierung des HTML (HTML-Code):

Plain Text
HTML:
  1. > <div class = "accordion">
  2. > Accordion 1 </a> <a href = "#acc1"> Akkordeon 1 </ a>
  3. > </a> <a name = "acc1"> </ a>
  5. <h1> Inhalt # 1 </ h1>
  6. <p> Bla bla bla .... </ p>
  7. </ Div>
  9. > Accordion 2 </a> <a href = "#acc2"> Akkordeon 2 </ a>
  10. > </a> <a name = "acc2"> </ a>
  12. <h1> Inhalt # 2 </ h1>
  13. <p> Bla bla bla .... </ p>
  14. </ Div>
  16. > Accordion 3 </a> <a href = "#acc3"> Akkordeon 3 </ a>
  17. > </a> <a name = "acc3"> </ a>
  19. <h1> Inhalt # 3 </ h1>
  20. <p> Bla bla bla .... </ p>
  21. </ Div>
  23. </ Div>

Das Ergebnis ist ein einfaches Menü Akkordeon, die verwendet werden können in einer Art und Weise sehr schnell.

Verwandte Post

Schlagwörter:
Pubblicato in Internet , Javascript , Sviluppo , Tutorials | Kein Kommentar »

Akkordeon 2,0

Mittwoch, 19. September 2007

Bild Wir haben bereits gesagt unaufdringlich Javascript-Bibliothek von den gleichen Autor LightWindow 2.0. Es ist nun die Version 2.0, die ist immer scriptaculous.
Zu den vielversprechendsten Entwicklungen ist die Fähigkeit, "sich" der ein Akkordeon in der anderen, modlità sowohl horizontal als auch vertikal.
Dann laufen weg von den klassischen Accrodion wurde hinzugefügt, um das Verhalten von Öffnen und Schließen. Auf der Website können Sie das Skript (mit den Worten noch 1.0?) Und Zugang zu Code-Beispielen.

Verwandte Post

Schlagwörter:
Im Internet veröffentlicht, Javascript, Entwicklung | Kein Kommentar »

Akkordeon für scriptaculous

Montag, 16. Juli 2007

Endlich mal ein gutes Skript in Javascript (download Akkordeon 1,0), einfache und leichte, die Ihnen erlaubt, um das Akkordeon-Komponente, die in Flash und Mootools Benutzung der Bibliothek scriptaculous. Eigentlich fehlt diesen Artikel, in vielen Fällen sinnvoll. Diese Version ist sehr einfach und erlaubt Ihnen, beide Akkordeon orizzonali und vertikal. Das Skript ist kostenlos, doch können Sie eine kleine Spende an Autor helfen Sie erwerben eine gute MacPro ;)

So verwenden Sie nur diesen einfachen Code:

Plain Text
HTML:
  1. src = "javascript/prototype.js" > </script> <script "text/javascript" type = src = "javascript/prototype.js"> </ script>
  2. src = "javascript/effects.js" > </script> <script "text/javascript" type = src = "javascript/effects.js"> </ script>
  3. src = "javascript/accordion.js" > </script> <script "text/javascript" type = src = "javascript/accordion.js"> </ script>

Die HTML-Markup stellt sich unmittelbar ein:

Plain Text
HTML:
  1. > Title Bar </h3> <h3 class = "accordion_toggle"> Title Bar </ h3>
  2. > <div class = "accordion_content">
  3. ...
  4. </ Div>
  5. ...
  6. ...
  7. ...
  8. > Title Bar </h3> <h3 class = "accordion_toggle"> Title Bar </ h3>
  9. > <div class = "accordion_content">
  10. ...
  11. </ Div>

Ein praktisches Beispiel:

Plain Text
JavaScript:
  1. / / Allgemeine Syntax
  2. 'container-selector' , options ) ; neue Akkordeon ( "Container-Selector", Optionen);
  5. / / Horizontal Beispiel
  6. accordion ( '#top_container' , { var horizontalAccordion = new Akkordeon ( '# top_container', (
  7. Klassennamen: (
  8. Toggle: "horizontal_accordion_toggle",
  9. toggleActive: "horizontal_accordion_toggle_active ',
  10. Inhalt: "horizontal_accordion_content"
  11. ),
  12. defaultSize: (
  13. Breite: 525
  14. ),
  15. Richtung: "horizontale"
  16. ));
  18. / / Vertikal-Akkordeon
  19. accordion ( '#bottom_container' ) ; var verticalAccordion = new Akkordeon ( '# bottom_container');

Verwandte Post

Schlagwörter:
Im Internet veröffentlicht, Javascript, Entwicklung | 3 Kommentare »