Do you know how to build thumbnails on the right side, that when click on, will
enlarge the picture of the thumbnail clicked into a space on the left side.
(Not open another page with the enlarged picture? If so, can you give me a step
by step procedure on how to create within Dreamweaver CS3?

thanks,
Carol

"Carol Brozman" <webforumsuser@macromedia.com> wrote in message
news:gbqoq3$e4t$1@forums.macromedia.com...
> Do you know how to build thumbnails on the right side, that when click on,
> will
> enlarge the picture of the thumbnail clicked into a space on the left
> side.
> (Not open another page with the enlarged picture? If so, can you give me a
> step
> by step procedure on how to create within Dreamweaver CS3?
>
> thanks,
> Carol
>

Hi Carol

I have just done this ( ok my images are on top of each other) see if this
is what you were looking for.

http://zitech.co.uk/nslc/test4.php

This was done with a small piece of javascript and the code for all of this
page is below.

Just put in your own picture names and it just works. I have gone further
with this one and now load the images from a database so have replaced the
picture file names with variable.

<script type="text/javascript">

function doIt(obj){
document.getElementById("bigpic").src=obj.src
}

</script>
<center><a href="about.php"><img id="bigpic"
src="http://www.zitech.co.uk/nslc/images2/M408_Diana_Daniels_2_16_04_07.jpg"
width="640px" height="428px" ></center>
<br>
<br>
<br>
<br>
<br>
<br>
<hr>
<table width="80%" border="0" align="center">
<tr>
<td><img
src="http://www.zitech.co.uk/nslc/images2/M408_Diana_Daniels_2_16_04_07.jpg"
alt = "Tag here 1" width="100px" height="100px" onclick="doIt(this)"></td>
<td><img
src="http://www.zitech.co.uk/nslc/images2/M301-Murton-School-elsie-fo.jpg"
width="100px" height="100px" onclick="doIt(this)"></td>
<td><img
src="http://www.zitech.co.uk/nslc/images2/M256_Age_of_Chivalry.jpg"
width="100px" height="100px" onclick="doIt(this)"></td>
<td><img src="http://www.zitech.co.uk/nslc/images2/M210_Our_House2.jpg"
width="100px" height="100px" onclick="doIt(this)"></td>
<td><img src="http://www.zitech.co.uk/nslc/images2/Winter.jpg"
width="100px" height="100px" onclick="doIt(this)"></td>
<td> <img src="http://www.zitech.co.uk/nslc/images2/Sunset.jpg"
width="100px" height="100px" onclick="doIt(this)"></td>
<td> <img
src="http://www.zitech.co.uk/nslc/images2/M204_Linskill_Football_Team.jpg"
width="100px" height="100px" onclick="doIt(this)"></td>
<td><img
src="http://www.zitech.co.uk/nslc/images2/M154_Dalia_growing_Bill_Mahon_400x291.jpg"
width="100px" height="100px" onclick="doIt(this)"></td>
<td> <img
src="http://www.zitech.co.uk/nslc/images2/M0234_Deed_Hoose_2_July_04.jpg"
width="100px" height="100px" onclick="doIt(this)"></td>
<td><img
src="http://www.zitech.co.uk/nslc/images2/M0141_Thompson_red_Stamp2.jpg"
width="100px" height="100px" onclick="doIt(this)"></td>
</tr>
<tr>
<td><div align="center"><a href="accessibility.php">Memory 34</a>
</div></td>
<td><div align="center">Memory 35</div></td>
<td><div align="center">Memory 36</div></td>
<td><div align="center">Memory 37</div></td>
<td><div align="center">Memory 38</div></td>
<td><div align="center">Memory 39</div></td>
<td><div align="center">Memory 40 </div></td>
<td><div align="center">Memory 41 </div></td>
<td><div align="center">Memory 42 </div></td>
<td><div align="center">Memory 43 </div></td>
</tr>
</table>


Let us know how you get and and if this was of use.

Derek

http://www.doknowevil.net/litebox/

www.jalbum.net

--Nancy O.
Alt-Web Design & Publishing
www.alt-web.com


"Carol Brozman" <webforumsuser@macromedia.com> wrote in message
news:gbqoq3$e4t$1@forums.macromedia.com...
> Do you know how to build thumbnails on the right side, that when click on,
will
> enlarge the picture of the thumbnail clicked into a space on the left
side.
> (Not open another page with the enlarged picture? If so, can you give me a
step
> by step procedure on how to create within Dreamweaver CS3?
>
> thanks,
> Carol
>

Hello Nancy,

Thank you for your reply. Litebox solution, still opens another window. I am
looking for a solution where the thumbnails are designed to the right side of a
web page, and a larger space to the right would house the image once the
thumbnail has been selected/clicked on. Then the user is not thrown to another
window or page, but remains on the page with the thumbnails to continue to
view/select.

Any solution found in Dreamweaver - not so much interested in third party
solutions, unless it is within the family of Adobe products.

thanks,
Carol

Sorry I mean a larger space to the left side in my answer to your reply would house the thumbnail image.

There's nothing like that "included" in Dreamweaver.

SimpleViewer is very close to what you're looking for. It uses Flash though, I
don't know if that's a deal breaker for you.

http://www.airtightinteractive.com/photos/ (demo)
http://www.airtightinteractive.com/simpleviewer/ (download)

You could build a page that shows/hides divs when you click on specific
thumbnails if you want to keep it to only HTML and JavaScript. That would be
quite time consuming compared to using a thirdparty solution.

Joey,
Hello, thank you for your great reply and information.

At first I was hestitant because I do not want the site contingent on having
Flash, but looking again, this is exactly what I am imagining.

Thank you so much - I believe your solution to be the best.

Carol

JoeyD1978
Really good info that has got me thinking of using it myself....so thx for the lead very neat app indeed.