Special Effects (SpecialFX) allow you to define the visibility of objects. For example, you may not want an image to be visible until your visitor places their mouse over it, or until they place their mouse over another object on the page.
You could also set an object to disappear when the visitor places their mouse over it, or when they mouse over another object on the page.
There are three classes of special effects available from the SpecialFX menu on the menu bar at the top of your workpage:
Loading effects
Hide While loading: the object is hidden while it is loading. Typically you will apply this to an image that you don't want to appear until it is fully loaded
Hide After Loading: the object is hidden after loading as well. Typically, you want the object to stay hidden until a mouse event occurs (like a mouse over or mouse button down).
There is a red rectangle hidden behind this text. It will show only in workpage view, and there is no hint of its presence in preview. Try Preview a few times -- also click Refresh on your browser a few times to confirm this. If you remove the Hide While Loading effect for the red rectangle, you should see a red flash as you switch from workpage mode to preview mode (by clicking the Preview button).
Hide on Mouse Over: When the visitor mouses over the object, it will disappear. Try the one on the left
Hide on Mouse Leave: When the visitor's mouse leaves the object, it will disappear. This means the object has to become visible when the mouse goes over the object Try the Mouse me button on the left -- this one is invisible to start with.
If you mouse over an object, or click on it, you can:
either hide or make visible that object; and/or
either hide or make visible some other object.
The are a few combinations in there! Let's try one:
...
Go to the Special FX menu and select Mouse Effects ... Or just press Alt+X
For Event:, select mouse pointer is over
For Trigger Object:, scroll down the list until you find an object named redrectangle
For Action:, select hide it, and show
For Display Object:, select bluerectangle
Click OK
Preview the page
In your browser, move your mouse over the red rectangle just below.
Other mouse effect examples
Try playing with some of the other options to see what kind of effects you can create!
Boo!!
Boo!!
Press me!
Mouse me!
Ha!!
Ha!!
Press me!
Mouse me!
In workpage view, click the the object first, then ALT+X -- then you won't have change the trigger object.
Hot tip!
SpecialFX problems
These special effects rely on your browser being able to use Javascript. If your mouse overs do not work and neither do the ones in this tutorial, chances are you have Javascript disabled. Most browsers have a setting to turn Javascript (scripting) on or off -- sometimes it can be hard to find!
You can get over-complicated. It is possible to have mouse effects pulling in opposite directions. Strive for the simplest possible effect. If you can't get something to work as you want:
Remove all mouse effects from the objects concerned
Use the main menu Edit > Clean Components
Add one effect
Preview
Repeat the last two steps for each new effect
If these steps fail, try the effect in a new project. It is possible that something else on the page is interfering with it. Anything that causes a Javascript error will probably cause your special effect to fail.
