Implementing DHTML in WebExpress


 Hide/show script: (for demo click here)

Currently in WebX:

To make this easier in WebX:

To add the hide script:

Paste in the 'detect.js' script.


Name: src
Value: hide.js

same for show.js

Add the 'detect.js' script whenever you use a script which acts upon a named DIV element, or when changing width or height.

Import>Scripts>move should create the 'detect.js' script tag and 'hide.js', 'show.js' script tag.


Create a DIV tag with an 'ID' set:
ID = "test"
Then create a paragraph of text inside the DIV which you'd like to move when a link is clicked or passed over.
Create a link
Hit the 'Extensions' button in the link dialog
Name: onmouseover
Value: show ('test');
Name: onmouseout 
Value: hide ('test');

The higher the zIndex number the higher the layer... so 1 is above 0.

Any DIV tags with ID's set should be recorded in a list which you can choose from later in the 'hide/show' dialog.

If you use 'onclick' you will have to set the link to 'javascript: void(0);'


Rules/Problems with the 'hide.js' script:

The DIV ID's cannot be set automatically... (or can they?) 

The hide.js and show.js scripts should probably be combined.


function hide(name)

//hide element -name-


if (unable) return;

if (DOM) {eval (wholebit + ".visibility = 'hidden'"); return;}

eval (frontbit + name + endbit + ".visibility = 'hidden'");


function show(name)

//show element -name-


if (unable) return;

if (DOM) {eval (wholebit + ".visibility = 'visible'"); return;}

eval (frontbit + name + endbit + ".visibility = 'visible'");