www.wikidata.de-de.nina.az

script aculo us ist eine JavaScript Bibliothek die auf dem JavaScript Framework Prototype aufbaut Sie bietet dynamische

script.aculo.us

script.aculo.us ist eine JavaScript-Bibliothek, die auf dem JavaScript-Framework Prototype aufbaut. Sie bietet dynamische visuelle Effekte und GUI-Elemente über das Document Object Model (DOM). Dadurch wird die Erstellung dynamischer GUIs für Internetseiten stark vereinfacht.

script.aculo.us

Basisdaten

Entwickler Thomas Fuchs
Erscheinungsjahr Juni 2005
Aktuelle Version 1.9.0
(23. Dezember 2010)
Betriebssystem plattformunabhängig
Programmiersprache JavaScript
Lizenz MIT-Lizenz
script.aculo.us

Ganz besonders ist es in Ruby on Rails integriert, wird allerdings auch separat angeboten, damit es mit anderen Web Application Frameworks und Scriptsprachen zusammenarbeitet.

script.aculo.us wurde von Thomas Fuchs aus dem Tool fluxiom entnommen, einem webbasierten Digital-Asset-Management-Tool der Designerfirma wollzelle. Der Öffentlichkeit wurde es erstmals im Juni 2005 vorgestellt.

Merkmale Bearbeiten

script.aculo.us erweitert das Prototype JavaScript Framework durch visuelle Effekte, GUI-Elemente und andere Funktionen.

Visuelle Effekte Bearbeiten

Es gibt fünf Kerneffekte, script.aculo.us bietet: Opacity, Scale, MoveBy, Highlight, und Parallel. Durch diese Effekte ergeben sich über 16 zusätzliche Effekte, die Kombinationen der Kerneffekte nutzen. Programmierer können diese Effektpalette auch noch erweitern und neue Effekte hinzufügen.

Um einen Effekt zu aktivieren, muss man dem jeweiligen Element eine ID-Bezeichnung zuordnen und eine Zeile Code für den Effekt hinzufügen. Nachfolgend ist ein Beispiel des Effekts Effect.Fade, der auf ein DOM-Element mit der ID 'id_of_element’ angewandt wird: 

new Effect.Fade('id_of_element');

Dadurch wird das Element mit der Ziel-ID ausgeblendet und am Ende die CSS-Eigenschaft display-Eigenschaft auf none gesetzt.

Es können einige Einstellungen, wie z. B. die Dauer und Reichweite des Effekts eingestellt werden: 

new Effect.Fade('id_of_element',  { duration:2.0, from:0.0, to:0.8 });

Dadurch wird das Element eingeblendet, der Effekt stoppt allerdings, wenn er 80 % fertig ist (bei einer Deckkraft von 20 %).

Controls Bearbeiten

Controls bieten GUI-Elemente, darunter:

  • Drag And Drop
    • Draggables
    • Droppables
    • Sortables
    • Slider
  • Autocompletion
  • In Place Editing

Builder Bearbeiten

Durch den Builder können DOM-Elemente dynamisch erzeugt werden. Durch Benutzung des unteren Beispielcodes … 

element = Builder.node('div',{id:'ghosttrain'},[  Builder.node('div',{className:'controls',style:'font-size:11px'},[  Builder.node('h1','Ghost Train'),  "testtext", 2, 3, 4,  Builder.node('ul',[  Builder.node('li',{className:'active', onclick:'test()'},'Record')  ])  ]) ]);

… wird folgender HTML-Code erzeugt (ohne neue Zeilen): 

<div id="ghosttrain"> <div class="controls" style="font-size:11px"> <h1>Ghost Train</h1> testtext234 <ul> <li class="active" onclick="test()">Record</li> </ul> </div> </div>

Siehe auch Bearbeiten

Literatur Bearbeiten

  • javascript Bibliotheken. In: c’t, 8/2010, S. 154

Weblinks Bearbeiten

Einzelnachweise Bearbeiten

  1. Thomas Fuchs: Audible Ajax Episode 12 Ajaxian
wikipedia, wiki, deutsches, deutschland, buch, bücher, bibliothek artikel lesen, herunterladen kostenlos kostenloser herunterladen, MP3, Video, MP4, 3GP, JPG, JPEG, GIF, PNG, Bild, Musik, Lied, Film, Buch, Spiel, Spiele
Veröffentlichungsdatum:
script aculo us ist eine JavaScript Bibliothek die auf dem JavaScript Framework Prototype aufbaut Sie bietet dynamische visuelle Effekte und GUI Elemente uber das Document Object Model DOM Dadurch wird die Erstellung dynamischer GUIs fur Internetseiten stark vereinfacht script aculo usBasisdatenEntwickler Thomas FuchsErscheinungsjahr Juni 2005Aktuelle Version 1 9 0 23 Dezember 2010 Betriebssystem plattformunabhangigProgrammiersprache JavaScriptLizenz MIT Lizenzscript aculo usGanz besonders ist es in Ruby on Rails integriert wird allerdings auch separat angeboten damit es mit anderen Web Application Frameworks und Scriptsprachen zusammenarbeitet script aculo us wurde von Thomas Fuchs aus dem Tool fluxiom entnommen einem webbasierten Digital Asset Management Tool der Designerfirma wollzelle 1 Der Offentlichkeit wurde es erstmals im Juni 2005 vorgestellt Inhaltsverzeichnis 1 Merkmale 1 1 Visuelle Effekte 1 2 Controls 1 3 Builder 2 Siehe auch 3 Literatur 4 Weblinks 5 EinzelnachweiseMerkmale Bearbeitenscript aculo us erweitert das Prototype JavaScript Framework durch visuelle Effekte GUI Elemente und andere Funktionen Visuelle Effekte Bearbeiten Es gibt funf Kerneffekte script aculo us bietet Opacity Scale MoveBy Highlight und Parallel Durch diese Effekte ergeben sich uber 16 zusatzliche Effekte die Kombinationen der Kerneffekte nutzen Programmierer konnen diese Effektpalette auch noch erweitern und neue Effekte hinzufugen Um einen Effekt zu aktivieren muss man dem jeweiligen Element eine ID Bezeichnung zuordnen und eine Zeile Code fur den Effekt hinzufugen Nachfolgend ist ein Beispiel des Effekts Effect Fade der auf ein DOM Element mit der ID id of element angewandt wird new Effect Fade id of element Dadurch wird das Element mit der Ziel ID ausgeblendet und am Ende die CSS Eigenschaft display Eigenschaft auf none gesetzt Es konnen einige Einstellungen wie z B die Dauer und Reichweite des Effekts eingestellt werden new Effect Fade id of element duration 2 0 from 0 0 to 0 8 Dadurch wird das Element eingeblendet der Effekt stoppt allerdings wenn er 80 fertig ist bei einer Deckkraft von 20 Controls Bearbeiten Controls bieten GUI Elemente darunter Drag And Drop Draggables Droppables Sortables Slider Autocompletion In Place EditingBuilder Bearbeiten Durch den Builder konnen DOM Elemente dynamisch erzeugt werden Durch Benutzung des unteren Beispielcodes element Builder node div id ghosttrain Builder node div className controls style font size 11px Builder node h1 Ghost Train testtext 2 3 4 Builder node ul Builder node li className active onclick test Record wird folgender HTML Code erzeugt ohne neue Zeilen lt div id ghosttrain gt lt div class controls style font size 11px gt lt h1 gt Ghost Train lt h1 gt testtext234 lt ul gt lt li class active onclick test gt Record lt li gt lt ul gt lt div gt lt div gt Siehe auch BearbeitenjQueryLiteratur Bearbeitenjavascript Bibliotheken In c t 8 2010 S 154Weblinks Bearbeitenoffizielle Webprasenz Dokumentation Wiki Cheat Sheet Deutschsprachige Effekte Einfuhrung Google Code developer guideEinzelnachweise Bearbeiten Thomas Fuchs Audible Ajax Episode 12 Ajaxian Abgerufen von https de wikipedia org w index php title Script aculo us amp oldid 234750120