Script.aculo.us Anfänger Hilfe

Atis

Grünschnabel
Hallo,

gerade beginne ich meine ersten Schritte in scriptaculous.
Leider wird mein HTML immer grösser und grösser. Ist es möglich, die Funktionen unter "mouseOver", "onClick" etc. in eine seperate JS Datei auszulagern? Bisher ist mir das nicht gelungen. Auch this.element hat nicht funktioniert, ich muss immer die gesamten IDs angeben..
Kann mir jemand bitte einen Tipp geben, wie ich eine eigene JS Datei erstelle?

Code:
<div id="el.menu.bar.off_ID" class="menuBarBorderOff" onMouseOver="Element.setStyle('el.menu.bar.off_ID',{'borderColor':'#5d6e7e'}); Element.setStyle('el.menu.bar.arrow.off_ID',{backgroundImage:'url(img/menu/arrow_closed_on.gif)'});" onMouseOut="Element.setStyle('el.menu.bar.off_ID',{'borderColor':'#3a4755'}); Element.setStyle('el.menu.bar.arrow.off_ID',{backgroundImage:'url(img/menu/arrow_closed_off.gif)'});"></div>

Danke und Grüße aus Berlin
Atis
 
Zuletzt bearbeitet:
Mach funktionen draus und binde es ganz gewöhnlich als js-Datei ein:
HTML:
<div id="el.menu.bar.off_ID" class="menuBarBorderOff" onMouseOver="Funktion2()" onMouseOut="Funktion1()"></div>
Das kommt dann in die js-Datei:
Javascript:
function Funktion1() { 
    Element.setStyle('el.menu.bar.off_ID',{'borderColor':'#5d6e7e'});
    Element.setStyle('el.menu.bar.arrow.off_ID',{backgroundImage:'url(img/menu/arrow_closed_on.gif)'});
}

function Funktion2() {
    Element.setStyle('el.menu.bar.off_ID',{'borderColor':'#3a4755'});
    Element.setStyle('el.menu.bar.arrow.off_ID',{backgroundImage:'url(img/menu/arrow_closed_off.gif)'})
}
Und so wied kann man Script-Dateien einbinden:
HTML:
<html><head><title>Text</title>

<script type="text/javascript" src="http://www.beispiel.de/scripts/script.js"></script>

</head>....
 

Neue Beiträge

Zurück