Scriptaculous: Difference between revisions

From Elvanör's Technical Wiki
Jump to navigation Jump to search
No edit summary
Line 23: Line 23:


* Beware that calling document.stopObserving("mousemove") will prevent all your draggable objects from being actually dragged. If you really need to call document.stopObserving(), you should destroy all your Draggable objects before doing so, and recreate them afterwards.
* Beware that calling document.stopObserving("mousemove") will prevent all your draggable objects from being actually dragged. If you really need to call document.stopObserving(), you should destroy all your Draggable objects before doing so, and recreate them afterwards.
* If you mess up something, strange behavior may occur such as the draggable being dragged when you don't expect it to - so watch for this symptom when debugging.


= Autocompletion =
= Autocompletion =


* Scriptaculous offers a very nice framework for autocompletion, either local or on the server through Ajax. If you need autocompletion, use this framework!
* Scriptaculous offers a very nice framework for autocompletion, either local or on the server through Ajax. If you need autocompletion, use this framework!

Revision as of 08:57, 10 September 2008

Basics

  • One of the main design choice of Scriptaculous is to allow you to create your own effects by combining several core effects.

Effects

Core Effects vs. Combination Effects

  • If you want an element to appear by growing out of nowhere, try directly the Grow effect. I could not make the basic scale effect to work correctly.
  • Usually, you will want to use a combination effect directly. For example, using Opacity() is tedious because the hide() / show() for elements can cause some flicker. Using Effect.Fade() takes care of all that automatically.

Effect Queues

  • Documentation Link.
  • I have not intensely used queues yet. The basic callback options (like afterFinish) are enough for me most of the time. However, beware: don't use the queue options ("queue": "end") with a callback. This caused some delay on the second effect when I tried this. Removing the queue option made it instantly faster.

Effects Description

  • Fade() and Appear() are simple effects but very nice.
  • BlindDown() and BlindUp() can also be quite useful, especially combined with an dark opacity overlay like ModalBox does.

Drag & Drop

  • Beware that calling document.stopObserving("mousemove") will prevent all your draggable objects from being actually dragged. If you really need to call document.stopObserving(), you should destroy all your Draggable objects before doing so, and recreate them afterwards.
  • If you mess up something, strange behavior may occur such as the draggable being dragged when you don't expect it to - so watch for this symptom when debugging.

Autocompletion

  • Scriptaculous offers a very nice framework for autocompletion, either local or on the server through Ajax. If you need autocompletion, use this framework!