script.aculo.us

script.aculo.us – biblioteka programistyczna w języku JavaScript udostępniana na Licencji MIT, której bazą jest Prototype JavaScript Framework, rozszerzając go o animacje i elementy interfejsu użytkownika na bazie obiektowego modelu dokumentu. Jest też dołączany do Seaside i Ruby on Rails.

Możliwości

script.aculo.us rozszerza Prototype JavaScript Framework poprzez dodanie efektów wizualnych, kontrolek interfejsu użytkownika i dodatkowe narzędzia.

Efekty wizualne

Istnieje pięć głównych efektów: przeźroczystość, skalowanie, przesunięcie, podświetlenie i równoległość. Te efekty są wykorzystywane przez 16 zewnętrznych poprzez ich kombinacje.

Uruchomienie efektów jest zorientowane obiektowo i najczęściej zajmuje jedną linijkę kodu. Jako pierwszy parametr podajemy identyfikator elementu, a w drugim (opcjonalnym) ustawienia.

new Effect.Fade('id_elementu');

Z parametrami:

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

To spowoduje efekt zanikania, ale zatrzyma się na 20%.

Kontrolki

Kontrolki oferują interfejs użytkownika w tym:

Przeciągnij i upuść
- Przeciąganie
- Upuszczanie
- Sortowanie
- Suwaki
Autouzupełnianie
Edytowanie w miejscu

Obiekt budujący

Obiekt budujący pozwala na tworzenie obiektów DOM w locie. Przykładowo:

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')
    ])
  ])
]);

Kod utworzy (bez znaków nowej linii):

<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>

Zobacz też

Linki zewnętrzne

Strona domowa script.aculo.us
Wiki dokumentacji script.aculo.us
Nieoficjalne FAQ biblioteki Prototype i script.aculo.us stworzone przez społeczność użytkowników