clickable image map

bigbjohn · #1 04-18-2003, 01:46 AM

CLICKABLE MAP
HI THERE PLEASE COULD YOU HELP ME ON THIS CLICKABLE MAP AS I HAVE GOT SO FAR ON IT BUT COME TO A STOP ITS ALL BELOW
what i am trying to do is make it so when you click on the small picture image box it takes that small picture to the bigger picture box all on the one page what i am trying to do is have 6 small boxes on the right 2 rows across and three rows down AND HAVE the bigger picture on the left i have seen it many time on the net but just cant master it now . kind regards john or bigbjohn
<HTML>

<HEAD>

<TITLE></TITLE>

</HEAD>

<BODY><A HREF="http:// my server here/"><IMG SRC="bear1.jpg" HEIGHT="282" WIDTH="320" ALT="bear1.jpg *" NAME="bear1.jpg" HSPACE="10" VSPACE="10" ALIGN="LEFT"></a><P ALIGN=RIGHT><A HREF="http://my server here/"><IMG SRC="bear1.jpg" HEIGHT="62" WIDTH="72" ALT="bear1.jpg *" NAME="bear1.jpg" HSPACE="10" VSPACE="10"

<IMG SRC="bear2.jpg"><IMG SRC="bear2.jpg" HEIGHT="62" WIDTH="72" ALT="bear2.jpg *" NAME="bear2.jpg" HSPACE="10" VSPACE="10"

<IMG SRC="bear3.jpg"><IMG SRC="bear3.jpg" HEIGHT="62" WIDTH="72" ALT="bear3.jpg *" NAME="bear3.jpg" HSPACE="10" VSPACE="10"

<IMG SRC="bear4.jpg"><IMG SRC="bear4.jpg" HEIGHT="62" WIDTH="72" ALT="bear4.jpg *" NAME="bear4.jpg" HSPACE="10" VSPACE="10"

<IMG SRC="bear5.jpg"><IMG SRC="bear5.jpg" HEIGHT="62" WIDTH="72" ALT="bear5.jpg *" NAME="bear5.jpg" HSPACE="10" VSPACE="10"

<IMG SRC="bear6.jpg"><IMG SRC="bear6.jpg" HEIGHT="62" WIDTH="72" ALT="bear6.jpg *" NAME="bear6.jpg" HSPACE="10" VSPACE="10"

<IMG SRC="bear7.jpg"><IMG SRC="bear7.jpg" HEIGHT="62" WIDTH="72" ALT="bear7.jpg *" NAME="bear7.jpg" HSPACE="10" VSPACE="10"

<IMG SRC="bear8.jpg"><IMG SRC="bear8.jpg" HEIGHT="62" WIDTH="72" ALT="bear8.jpg *" NAME="bear8.jpg" HSPACE="10" VSPACE="10"

</BODY>

</HTML>

khalidali63 · #2 04-18-2003, 09:13 AM

How about adding onclick event calls in the image tags such as
<IMG SRC="bear2.jpg"><IMG SRC="bear2.jpg" HEIGHT="62" WIDTH="72" ALT="bear2.jpg *" NAME="bear2.jpg" HSPACE="10" VSPACE="10" onclick="showFullSize('bear2.jpg')">

And in the javascript code section..

function "showFullSize(imgURL){
/now here you have to decide about where or how you want to show the larger image,if its on the page ata sertain location then create an div tag with id="imgId">
and then add an image element to it

}

bigbjohn · #3 04-18-2003, 07:46 PM

thanks for that i will give it a go as iam a big big learner at this so all the help is good and greatfull for it thanks bigbjohn

Thread Tools	Search this Thread
Show Printable Version Email this Page	Search this Thread: Advanced Search
Display Modes	Rate This Thread
Linear Mode Switch to Hybrid Mode Switch to Threaded Mode	Rate This Thread:

Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)