Friday, January 8, 2010

How do you put the HTML coding onto a web page to preview a picture in a defined area?

I want to put a bunch of thumbnails on my webpage and when the user clicks them, they open up in the window on that same page like hotel room pictures. Here is an example:





http://www.expedia.com/pub/agent.dll/qsc鈥?/a>How do you put the HTML coding onto a web page to preview a picture in a defined area?
%26lt;SCRIPT LANGUAGE=';JavaScript';%26gt;





//This is the function that calls two switch side image with main image








function imageChange(imageID,imageName) {





{


document.images[imageID].src = imageName;


}





}





%26lt;/SCRIPT%26gt;





%26lt;a name=';top';%26gt;%26lt;/a%26gt;


%26lt;!--bigimage--%26gt;%26lt;img src=';largeImage1.jpg'; name=';main';%26gt;





%26lt;!-thumbnails--%26gt;


%26lt;A HREF=';#top';


onClick=';imageChange('main' , 'largImage1.jpg' )'; %26gt;


%26lt;IMG SRC=';smallImage1.jpg'; BORDER=';0';%26gt;


%26lt;/A%26gt;


%26lt;A HREF=';#top';


onClick=';imageChange('main' , 'largImage2.jpg' )'; %26gt;


%26lt;IMG SRC=';smallImage2.jpg'; BORDER=';0';%26gt;


%26lt;/A%26gt;


%26lt;A HREF=';#top';


onClick=';imageChange('main' , 'largImage3.jpg' )'; %26gt;


%26lt;IMG SRC=';smallImage3.jpg'; BORDER=';0';%26gt;


%26lt;/A%26gt;





%26lt;!--small images are the thumbnails and large images are the largeimages of those thumbnails, if you want them to be the same images (not have a large/small) just use a set width/height for thumbnails--%26gt;How do you put the HTML coding onto a web page to preview a picture in a defined area?
Hi, that page is a flash design, VERY difficult to do if you dont know flash, I would look into a javescript based program that will do something close what you looking for, they have alot of free ones available out there if you search for javascript picture viewer, the top links to a paid one ($25) that might make it easier, the others are a couple of free software sites. Good luck, you can do ALOT of things with java on a website

No comments:

Post a Comment