jQuery Animations is a section in the Tasks & Animations panel that you can access in the HTML canvas. The Animations section, in the Tasks & Animations panel, allows you to execute jQuery animations on your HTML page. The animation effects in the Animations section can be used individually or in conjunction with each other to create more complex animations. The Animations section is shown in the following image.
A list of all animations present in the HTML page. This list will change when animations are added or deleted.
Adds a new animation to the HTML page. The newly added animation appears in the List of area.
Removes an animation from the HTML page. The deleted animation is removed from the List of area.
A list of all possible targets that can be used in the current animation being defined.
A list of all targets that will be used in the current animation.
Adds the currently selected object on the canvas to the Selected Targets list. Multiple objects can be selected and added at the same time.
Adds a selected object from the All Targets list to the Selected Targets list. Multiple objects can be selected and added at the same time.
Removes an object from the Select Targets list when that object is selected. Multiple objects can be selected and removed at the same time.
You can select whether or not to animate the target so that it is hidden or displayed. You can also select not to animate the target for visibility. The options are No Change, Hide, and Show.
The Effects group contains animation effects and the options you can use to customize those animations. Animation effects can make the target to bounce, shake, pulsate, and much more. You can also customize the options associated with that animation effect. The options correlate to the effect used. Such options can be how many times the target bounces after you specify that you want the bounce effect.
A drop-down list where you can select the animation effect you want to use.
You can select which option, if available, you would like to edit the value of. For example, selecting the Bounce animation type allows you to select Distance and Times in the Option drop-down list. When you select Distance or Times, you can then edit the value of either of those options in the Value area. If you select Times and then enter 3 into the Value area, your object will then bounce 3 times. The options available are different depending on what effect type you choose.
You can enter a number that pertains to the currently selected Option and that affects the animation. For example, if you select the Slide Type and the Distance Option, the number you enter in the Value area will be the distance the object will slide when it is animated. The value options available are different depending on what effect type you choose.
As the options for the effect are set, the syntax for that effect are displayed here. You can manually adjust this syntax to affect the animation.
The Additional Parameters group contains animations that change the location and size of the target and the components of that target (text size, text width, border size).
A drop-down list where you can select different properties that can be animated. Such properties include height, opacity, font size, and others.
The value for whichever property you choose from the Name field. For example, if you chose Left and put 10, the object you are animating would move 10 pixels to the left. The reason you do not need to specify a start value is because the currently location of the object is the start value.
You can animate the target so that the location and size of that target is changed once the animation is activated.
This will use the location of the currently selected target. That objects, coordinates, height, and width are entered into the Location setting box. This is used when the developer plans to move the selected target object and the animation will move it back.
Inserts an adjustable placeholder object into the canvas, at the location of the selected target. You can move and resize this placeholder object. This object represents where the animation will move to and what size it will be when the animation is complete.
Sets the adjustable object location and size. This will be where the animated object moves to and what size it will be. It is the ending location of the selected target,
Cancels the setting of location for the animation.
Once the location has been determined using the Location setting commands, the syntax for that location is displayed here. You can manually adjust this syntax to affect the animation.
How quickly the animation will execute. You can choose either Slow or Fast.
Allows you to revert to the pre-animation state. For example, if the target moves from right to left, the next invocation of the trigger will move the target back to the original position at the right.
| WebFOCUS |