If you have questions, look here first! If you feel like you’re having a questions (and maybe an answer) that will interested many people, please add it here.

General questions

1.1 Where to ask for help if I can’t find an answer here?

First, use the search function. If that won’t help, subscribe to the Mailing List and ask there.

1.2 Which browsers are supported?

See Supported Browsers.

1.3 Where can I see this in action?

See Demos.

1.4 Cool. So how to get started…?

See Usage.

1.5 So can I use this in my commercial app?

Yes. See License.

1.6 How do I extend/override without modifying the library code?

See HowtoExtendAndOverride.

1.7 How much overhead does script.aculo.us add to a page?

The complete library is about 228KB (including Prototype). Unofficially released compressed versions are available that can bring the files size down below 100KB, try looking on the mailing lists and support groups listed on the MailingList page for sources.

1.8 How do I convert a color to hex string for use in the effects?

String#parseColor() will convert to hex string format.
For example:

“rgb(1,2,3)”.parseColor() == “#010203”;
“#123”.parseColor() == “#102030”;
“#112233”.parseColor() == “#112233”;

Effects

2.1 On Internet Explorer, opacity-based effects don’t work!

Please see GivingElementsLayout. Starting with Vh2. 1.5_rc1 this issue should be automatically handled by script.aculo.us.

2.2 On Internet Explorer (yes, there’s a pattern here!), Effect.SlideUp/Effect.SlideDown are broken…?

That’s an Internet Explorer CSS bug, see Effect.SlideDown for a workaround. See http://css.nu/pointers/bugs-ie.html for more on this.

2.3 Some effects cause Firefox to flicker once

That’s a bug with the Gecko rendering engine in Firefox h2. 1.0.×. Starting with Firefox h2. 1.5b1 the flicker is gone. You can set the ‘overflow:hidden’ CSS style on the element you run the effect on as a workaround.

2.4 Effect.* doesn’t work when object’s display is none!

The problem lies with class / id definitions. use the inline property style=”display:none;” instead

2.4.1 Why?

script.aculo.us is based off of prototype.js, and calls the ‘show’ function to make an element visible. This works by setting the element’s style.display = ’’ (undef). This is intended to set it to the default, which is visible. However, if you have a style for display defined higher up in the CSS than the inline element level (which prototype is overwriting), it will look at the undefined style on your element and cascade up. Your stylesheet probably has display=’none’, so it looks like nothing is happening.

2.5 Effect.Appear doesn’t work from onload. Any Ideas?

See question 2.4.

2.6 Effect.* (Effect.Move, Effect.Morph) causes “this.initialize is not defined” error. Why?

You may ignore the “new” keyword. Use “new Effect.Move(…)” instead of “Effect.Move”.

Controls

3.1 I get weird Java Script errors, what do I do?

The most common cause of this is that you don’t include all script.aculo.us libraries. If you use anything from controls.js you must include effects.js, too. Otherwise, double check if you have typos regarding your id attribute names.

Drag and drop

4.1 Dragging/Dropping doesn’t work?

You may run in a browser limitation here if you specify CSS properties that are needed by the libraries in an external CSS file. Please try specifying properties in the inline style attribute of the affected element(s) instead.

4.2 Why can’t I make sortable TABLE elements?

Because of technical restrictions. See Sortable.create for more info on this.

4.3 The onUpdate callback on Sortable.create doesn’t seem to work!

You’re probably missing the requirements for naming the id attributes in the elements contained in your sortable element. See Sortable.serialize for more on this.

Also, when you call Sortable.create incorrectly, the elements may still be sortable yet the onUpdate and/or onChange events may not fire. For example, this may occur if you pass an element reference rather than an ID string as the first parameter.

4.4 How do I tell a Sortable that I added new elements to it?

Call Sortable.create again.

Autocompletion

5.1 Why does my input box show a blank result after selecting something from the autocompletion drop down list?

The value selected is everything not inside an element with a class=”informal”. Remove any whitespace from the result of your auto complete responder, to prevent this from being selected.

5.2 Nothing happens when I type something in?

See question h2. 3.1 for a possible solution.