SUBROUTINE IMAGEANCHOR
* Demonstrate the use of RW_IMAGE_ANCHOR.
* This page is designed to be loaded into a frameset, with a
* frame called "right". When an image is clicked, the new page
* is loaded into this frame.

* Include the RealWeb definitions

     INCLUDE #RW.INCLUDE.DEFS FROM /SYSFILES/REALWEB,BP

* Get the URL of the Reality item server.

     IMAGEFILE = ""
CALL RW_GET_PARAM("__isurl", IMAGEFILE)
* Specify the location of the file containing the images.

     IMAGEFILE = IMAGEFILE : "/REALWEB-ITEMS/"

* Start the HTML page.
CALL RW_START_HTML_PAGE("Image anchor Example", "", "", "", "")

* Insert a heading.

     TEXT = "RealWeb Examples"
CALL RWS_HEADING(TEXT, 3, "")
CALL RW_PUT(TEXT)

* Set up the image array.

     IMAGES = ""

     IMAGES<1> = IMAGEFILE : "Arrow1.gif"   ;* Normal image.

     IMAGES<2> = IMAGEFILE : "Arrow2.gif"   ;* Mouse over image.

     IMAGES<3> = IMAGEFILE : "Arrow3.gif"   ;* Mouse click image.

* Create a paragraph containing a list, with images used as bullets.
* Each image will be a link to another page, that will be loaded
* into the right hand frame.
CALL RW_START_PARA("", "")
CALL RW_IMAGE_ANCHOR("WELCOME", "Image anchor", IMAGES, "right", "")
CALL RW_PUT(" &nbsp;&nbsp;RW_START_HTML_PAGE")
CALL RW_NEWLINE

CALL RW_IMAGE_ANCHOR("PARA_S", "Image anchor", IMAGES, "right", "")
CALL RW_PUT(" &nbsp;&nbsp;RWS_PARA")
CALL RW_NEWLINE

CALL RW_IMAGE_ANCHOR("DIV_S", "Image anchor", IMAGES, "right", "")
CALL RW_PUT(" &nbsp;&nbsp;RWS_DIV")
CALL RW_NEWLINE

CALL RW_IMAGE_ANCHOR("IMAGE1", "Image anchor", IMAGES, "right", "")
CALL RW_PUT(" &nbsp;&nbsp;RW_IMAGE")
CALL RW_END_PARA

* Complete the page.
CALL RW_END_PAGE

RETURN

Subroutine result in browser

This shows the frameset after clicking the RW_START_HTML_PAGE and with the mouse over the RWS_PARA image.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<HTML>
<HEAD>
<META NAME="Generator" CONTENT="Reality">
<TITLE>Image anchor Example</TITLE>

<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">

IMAGE_1off = new Image;

IMAGE_1off.src = "/servlet/realityis/test/REALWEB-ITEMS/Arrow1.gif";

IMAGE_1on = new Image;

IMAGE_1on.src = "/servlet/realityis/test/REALWEB-ITEMS/Arrow2.gif";

IMAGE_1down = new Image;

IMAGE_1down.src = "/servlet/realityis/test/REALWEB-ITEMS/Arrow3.gif";

function img_act(imgName) {imgOn = eval(imgName + "on.src"); document[imgName].src = imgOn;}

function img_inact(imgName) {imgOff = eval(imgName + "off.src"); document[imgName].src = imgOff;}

function img_down(imgName) {imgDown = eval(imgName + "down.src"); document[imgName].src = imgDown;}

IMAGE_2off = new Image;

IMAGE_2off.src = "/servlet/realityis/test/REALWEB-ITEMS/Arrow1.gif";

IMAGE_2on = new Image;

IMAGE_2on.src = "/servlet/realityis/test/REALWEB-ITEMS/Arrow2.gif";

IMAGE_2down = new Image;

IMAGE_2down.src = "/servlet/realityis/test/REALWEB-ITEMS/Arrow3.gif";

IMAGE_3off = new Image;

IMAGE_3off.src = "/servlet/realityis/test/REALWEB-ITEMS/Arrow1.gif";

IMAGE_3on = new Image;

IMAGE_3on.src = "/servlet/realityis/test/REALWEB-ITEMS/Arrow2.gif";

IMAGE_3down = new Image;

IMAGE_3down.src = "/servlet/realityis/test/REALWEB-ITEMS/Arrow3.gif";

IMAGE_4off = new Image;

IMAGE_4off.src = "/servlet/realityis/test/REALWEB-ITEMS/Arrow1.gif";

IMAGE_4on = new Image;

IMAGE_4on.src = "/servlet/realityis/test/REALWEB-ITEMS/Arrow2.gif";

IMAGE_4down = new Image;

IMAGE_4down.src = "/servlet/realityis/test/REALWEB-ITEMS/Arrow3.gif";
</SCRIPT>

</HEAD>
<BODY>
<H3>

RealWeb Examples
</H3>

<P>
<A HREF="/servlet/reality/test/WELCOME" TARGET="right" onMouseOver="img_act('IMAGE_1')" onMouseOut="img_inact('IMAGE_1')" onMouseDown="img_down('IMAGE_1')" onMouseUp="img_act('IMAGE_1')"><IMG SRC="/servlet/realityis/test/REALWEB-ITEMS/Arrow1.gif" BORDER=0 ALT="Image anchor" NAME="IMAGE_1"></A> &nbsp;

 &nbsp;&nbsp;RW_START_HTML_PAGE
<BR>
<A HREF="/servlet/reality/test/PARA_S" TARGET="right" onMouseOver="img_act('IMAGE_2')" onMouseOut="img_inact('IMAGE_2')" onMouseDown="img_down('IMAGE_2')" onMouseUp="img_act('IMAGE_2')"><IMG SRC="/servlet/realityis/test/REALWEB-ITEMS/Arrow1.gif" BORDER=0 ALT="Image anchor" NAME="IMAGE_2"></A> &nbsp;

 &nbsp;&nbsp;RWS_PARA
<BR>
<A HREF="/servlet/reality/test/DIV_S" TARGET="right" onMouseOver="img_act('IMAGE_3')" onMouseOut="img_inact('IMAGE_3')" onMouseDown="img_down('IMAGE_3')" onMouseUp="img_act('IMAGE_3')"><IMG SRC="/servlet/realityis/test/REALWEB-ITEMS/Arrow1.gif" BORDER=0 ALT="Image anchor" NAME="IMAGE_3"></A> &nbsp;

 &nbsp;&nbsp;RWS_DIV
<BR>
<A HREF="/servlet/reality/test/IMAGE1" TARGET="right" onMouseOver="img_act('IMAGE_4')" onMouseOut="img_inact('IMAGE_4')" onMouseDown="img_down('IMAGE_4')" onMouseUp="img_act('IMAGE_4')"><IMG SRC="/servlet/realityis/test/REALWEB-ITEMS/Arrow1.gif" BORDER=0 ALT="Image anchor" NAME="IMAGE_4"></A> &nbsp;

 &nbsp;&nbsp;RW_IMAGE
</P>
</BODY>
</HTML>