This script implements increase or decrease in size of an image on the screen. The speed, step size and origin of expansion/contraction can be defined in the script call line or in a supporting list file..

The script supports a cascade of commands, defined in a list file, to give stunning visual effects on the screen.
Script call line in html
 The fundamental format is :-
        jwt_it( 'default_name', {task:'task_name', name:'element_name', list:'list_name'} )
 'list_name'  is the name of a list in the jwt_list.js file that contains either additional options for a single operation and/or a list of options for cascaded commands. The list_name, if not given in the call line,  will use the default_name.
'task_name'  is the function  to be run such as jwt_move or jwt_zoom.
'element_name'  is the cross reference to the placed <div> or <img> within the html file which is defined by the id tag of that element. The element_name, if not given in the call line will use the name defined in one of the associated list files and if these are not found will use the default_name. If two associated list files exist, one defined by the options list: and the other defined by the default_name, then the one defined by the list: eill take precidence. All options will be taken from this file and the default_name list will not be referenced.

Note : other options associated with the declared task can be included in the call line within the curly {}  or in the named list. The code has been written to have a priority look-up for the options :-
           call line  --> list file  --> program defaults    (except for  'element_name')
           call line  --> list file option  OR  list file  default_name  -->  default_name     (for 'element_name')
The allowable options for each different task are defined in the dedicated documentation for that task.

Script call line - flexibility
 The fundamental call line can be modified in several ways to define the list_name, element_name and task_name  :-
jwt_zoom( 'default_name', {task:'task_name', list:'list_name'} )              
will be defined by the default_name if the options name: is not defined.
jwt_zoom( 'default_name', {task:'task_name', name:'element_name'} )
            list_name will be defined by the element_name if the options list: is not defined.
jwt_zoom( 'default_name, {name:'element_name', list:'list_name'} )
            'task_name will be taken from the list file and, if not defined here, will use a program default.
jwt_zoom( 'default_name', {task:'task_name', list:'list_name'} )
             'element_name', the call line 'default_name' name will be taken if both the list file options and the
             'default_name' are not defined.
Thus it is possible to use   jwt_it( 'element_name'). The element_name and the list_name will use the default_name and the task must be defined in the list file options.

A sophisticated user of the jwt_* functions can adjust the default options in the scripts to define user specific default values in his/her web site.

Script using list file
All that is required in the html is : <img id = 'element_name' ><script>jwt_zoom( 'element_name' )</script>
All the options and the cascaded movement can be defined in the list file which has a similar syntax to the script call line. The element_name in the script call line, in this case, actually refers to the section of the list file to be used (red) and the first entry in the each line of the list (blue) is the element id to receive the commands. If this entry is left blank (" ") then it will default to thelist_name in the script call line. Normally the names are all the same.

var jwt_list=new Array();
jwt_list["list_name"]= [
["default_name", {task:'jwt_move', moveX:100, step:7}],
["default_name", {task:'jwt_move', moveX:0, moveY:-100, startX:'origin}],
["default_name", {task:'jwt_move', moveX:100, moveY:'bottom', offsetY:30}]

In a case where it is required to move a different div block or image during the sequece of moves, it is possible to code the list :-
var jwt_list=new Array();
jwt_list["list_name"]= [
["example", {task:'jwt_move', moveX:100, step:7}],
["flag", {task:'jwt_move', moveX:0, moveY:-100, startX:'origin'}],
["default_name", {name:'example', task:'jwt_move', moveX:100, moveY:'bottom', offsetY:30}]

Note: thw name: has been specified in two different ways in this list and the element flag will recieve the command .options.

In a case where it is required to use a different function in the sequence of cascaded commands, it is possible to code the list :-
var jwt_list=new Array();
jwt_list["list_name"]= [
["example", {task:'jwt_move', moveX:100, step:7'}],
["flag", {task:'jwt_zoom', width:250, startX:'left', startY:'middle'}],
["example", {task:'jwt_move' , moveX:100, moveY:'bottom', offsetY:30}]

zoom options
description option names default values notes  
id name of the block or image to be increased or decreased in size. name: * must be given *
name of list containing commands to be cascaded list: same name as <div> id
The new width of the image width: 0 units px 
The new height of the image height: 0 units px 
The fixed X location of the zoom
startX: "centre" "left"
The fixed Y location of the zoom startY: "middle" "top"
The increment used for the zoom
step: 8
 units px
a large number (e.g.9999) will  jump immedately to final location.
Defines the speed of movement
speed: 1 larger number --> slower movement
*  Defines a change to another function
task: "jwt_move"  e.g. jwt_move
 * these options are only used for cascaded commands in the list file

Required sub-scripts
jwt_define_arrays defines the arrays used within the main function
jwt-set saves the position before any moves so that a reset is possible
jwt_screen determines the screen dimensions and scroll offsets.
jwt_zoom_loop the loop around for the steps

Zoom notes

The jwt_zoom_example file has an image, defined by id="picture"  which can be increased or decreased in size . The form is only for demonstration purrposes allowing the options to be changed and a position reset to be invoked.  The options will normally be coded into the script call line but in this example page new options can be entered into the form to explore how the script works and to demonstrate the full capability. 

The jwt_it_example file contains 2 marquees (described in the jwt_marquee document) and two elements : a div block and an image which move across the screen The image , a flag, has a simple move defined in the script call line and a zoom at the end of the sequence whereas the div block  has three cascaded movements defined in the list file. In all cases the speed and step size has been set to different values.

Cascading commands
The jwt_it script can be used to start the cascade of commands running.
<script>jwt_cascade( 'name', {list:"list_name"} )</script>