DHTML Effects Page Transitions | Marquees | Hover buttons Text animation| Mouseover Images

Page transitions

1. In Page view, open the page for which you want to display the transition effect. 
2. On the Format menu, click Page Transition.
3. In the Event box, click the the event that will trigger the transition effect. For example, click Page enter to display the transition effect when a site visitor browses to the page for the first time.
4. In the Transition effect box, click the type of transition effect to use when the page is displayed or exited.
5. In the Duration box, type the amount of time that you want the transition effect to last.
6. Click the OK button.

Marquees

1. In Page view, click where you want to create the marquee, or select the text that you want to display in the marquee.
2. On the Insert menu, click Web Component.
3. In the left pane, click Dynamic Effects.
4. In the right pane, double-click Marquee.
5. In the Text box, type the line of text you want the marquee to display. If you selected text on the page in step 1, the Text box contains the selected text.
6. Select the Direction, Speed, Behavior, Size, Repetitions, and Background Color.
7. Click the OK button.

Hover buttons

1. In Page view, in the Normal pane, position the insertion point where you want to create a hover button.
2. On the Insert menu, click Web Component.
3. In the left pane, click Dynamic Effects.
4. In the right pane, double-click Hover Button.
5. In the Button text box, type the text label for the hover button. If you want to use a custom picture that already contains a text label, clear the default value.
6. In the Link to box, type the URL of the page or file you want to display when the hover button is clicked. Or, click Browse to locate the page or file.
7. Set the text label   Type the label you want to use in the Button text box. If you type a long label, adjust the Width of the hover button.
8. Set the default hyperlink   In the Link to box, type the URL to the page or file you want to display when the hover button is clicked. Or, click Browse to locate the page or file.
9. Set the color of the button when it is initially displayed on the page   Select the color you want to use.
10. Set the background color of the button   Select a background color for the hover button.
11. Set the hover effect   Select the visual effect that will be displayed when a site visitor points to the button.
12. Set the color of the hover effect   Select the color for the hover effect.
13. Set the size of the hover button   Modify the settings in the Width and Height boxes, in pixels.

Text animation

1. Select the text you want to animate, and then on the Format menu, click Dynamic HTML Effects. This will display the DHTML Effects toolbar.
2. In the On box, click the down arrow, and then select the event that will trigger the animation. The events listed in the On box are as follow:
           

   Click:   Starts the animation when the text is clicked with the left mouse button once. Double click:   Starts the animation when the text is double-clicked with the left mouse button. Mouse over:   Starts the animation when the pointer rests on or moves over the text.  Page load:   Starts the animation when the page is loaded in a browser.

3. In the Apply box, click the down arrow, and then select the type of animation effect you want to occur.

   The effects listed in the Apply box depend on the type of page element you selected and on the type of event you selected.

   Effects include:

   Fly out, Fly in, Drop in by word, Elastic, Hop, Spiral, Wave, Wipe, Zoom  are effects that move the text in some way. Formatting effects changes the appearance of the text, such as changing a font color or applying a border effect.

4. In the Choose Settings box, click the down arrow, and then choose the settings for the effect.  The settings listed depend on the type of page element you selected and the type of effect you selected in the Apply box.

Mouse-over images

Note:  Two images of the same size are need for this effect.

1. Select the image to which you want add the mouse-over effect, and then on the Format menu, click Dynamic HTML Effects. This displays the DHTML Effects toolbar.
2.  In the On box, click the down arrow, and then select the mouse over event.
3. In the Apply box, click the down arrow, and select Swap picture.
4. In the Choose setting box select Choose picture then browse to find the picture to swap.