Thumbnails that link to a main large image within that same page

[sharon_avnon]

Please take a quick look at this page:

http://tutimnyc.com/celeb.html

I need to ADD thumbnails to this page (image on the right is the thumbnail) and have then each link to a DIFFERENT main left image. Meaning everytime you click on one of the thumbnails the main image changes and this all happens within this page.

How do I do this???

HELP!

[ahimsa]

Re: Thumbnails that link to a main large image within that same page

Hi Sharon,
it's called an Inline frame - the icon is on the left tool bar - 3rd. one down
You can do something like this if you want......
hope that helps,
david

[sharon_avnon]

Re: Thumbnails that link to a main large image within that same page

Thank you!
Where can I read or learn step by step how to create such a page?
I just need detailed directions.

Thanks again
Sharon

[DarrenC]

Re: Thumbnails that link to a main large image within that same page

Here is something I wrote a little while back. Hope it helps.

1) Insert an I Frame (In Line Frame) on the page page of your choice. Name it what you like but for this example I am going to call it InlineFrame1. Make a note of the size of your I Frame.

2) For every page you are going to call up in this I Frame, you will need to publish individual pages. Pages can be images and text, whatever you like. Size these pages in page properties and accordingly to the size of the I Frame they will be displayed in later. I usually allow for a margin of around 5 pixels. If you are just wanting to display images, then you can just upload these directly via BlueFtp, just be sure you size them correctly.

Whatever you publish or upload, each will be given its own unique url.
In the case of pages, something like http://www.yoursitename.com/page1.html
In the case of images, something like http://www.yoursitename.com/image1.jpg

3) Back to the page with the I Frame. Insert buttons/ images/ thumbnails, whatever you will be clicking on to call up the appropriate content. Double click each one systematically to bring up the properties dialogue box. Click on 'Link Tab' and give it the corresponding url and manually type in the 'Target' field 'InlineFrame1. On the 'Events Tab', click 'Add Event' and select 'OnMouseOver > Show > Target > InlineFrame1.

4) Now double click the I Frame and give it the url of the first page or image you want displayed there.

5) Publish all the appropriate pages and test in your browser.


Here is example: http://www.rpconstruction.org/recent_projects2.php

You will see I have used 4 I Frames, so The I Frame is not very far away from the thumbnail of the image I want to display in it.

[sharon_avnon]

Re: Thumbnails that link to a main large image within that same page

can i use it within the design page i already have?

http://tutimnyc.com/celeb.html

or do i need to create something from scratch?

why don't they have a video tutorial for this????

thanks

sharon

[DarrenC]

Re: Thumbnails that link to a main large image within that same page

1) Yes you can. You would need to publish pages to include both the large picture and the text. This is covered in my explanation.

2) Thats the beauty of BV isn't it, to make a website from scratch instead of depending on templates to control your design.

3) The tutorials that VH have developed are free to use and they have made plenty to get the Newbie on their way to Web Design the rest is down to you to read, learn and practice new techniques. You'll find many answers to your questions here so you could say this forum is one big tutorial centre.

Good luck

[ahimsa]

Re: Thumbnails that link to a main large image within that same page

Sharon.....with respect to Darren this:
On the 'Events Tab', click 'Add Event' and select 'OnMouseOver > Show > Target > InlineFrame1.
is not necessary LOL
david

[DarrenC]

Re: Thumbnails that link to a main large image within that same page

Sharon.....with respect to Darren this:
On the 'Events Tab', click 'Add Event' and select 'OnMouseOver > Show > Target > InlineFrame1.
is not necessary LOL
david

Nice one David!!