...

View Full Version : textual menu to a pictorial one. Use CSS?



effpeetee
05-27-2007, 01:39 PM
Hello friends.

I have, at the address below, a page using a text style menu.

I would like to convert this to a pictorial one with small thumbnails as hyperlinks to the full page version of the pictures.

I want to use CSS but I do not have any idea as to what the outline would need to be.

I am not asking for detailed code, as I need to sort that out for myself; but an outline would be very acceptable.

Many thanks in advance.

effpeetee.

http://www.exitfegs.co.uk/Picchoose.html

SouthwaterDave
05-27-2007, 08:40 PM
I don't understand why you think CSS is the answer to your question.

You currently have links such as:

<a href="1a.html">1 - Steven relaxing on the Bluebell Railway.</a>

All you need to do is create the appropriate thumbnail image, call it something like thumb1a.jpg and then change your link to:

<a href="1a.html"><img src="thumb1a.jpg"></a>

I am, of course, assuming that you have image editing software. Paint.NET can be used for resizing images and it is a free download from Microsoft, but there are plenty of other programs around that could do this job.

effpeetee
05-27-2007, 10:24 PM
I don't understand why you think CSS is the answer to your question.

You currently have links such as:

<a href="1a.html">1 - Steven relaxing on the Bluebell Railway.</a>

All you need to do is create the appropriate thumbnail image, call it something like thumb1a.jpg and then change your link to:

<a href="1a.html"><img src="thumb1a.jpg"></a>

I am, of course, assuming that you have image editing software. Paint.NET can be used for resizing images and it is a free download from Microsoft, but there are plenty of other programs around that could do this job.
Thanks for the reply, but I am now in the process of building the thumbnail menu which can be accessed from this URL;

http://www.exitfegs.co.uk/Picchoose.html

The first picture (and its repeats) returns to the index page. All the others should return to the thumbnails. The program is called from the main index menu - Picture Menu.

It is not my code. One of the other Forum members, wrote it.

effpeetee

SouthwaterDave
05-28-2007, 12:07 PM
It looks very nice, but it loads very slowly.

The reason for this is because you are using your fullsize images as thumbnails. You should use image editing software to resize your images as thumbnail images. This will result in much smaller files so they will load into a browser more quickly.

Many of the titles don't match up with the pictures, but I realise that you're still developing your site at present.

abduraooft
05-28-2007, 12:58 PM
You should use image editing software to resize your images as thumbnail images.

If you are uploading this pictures by an html form and if you have a php or some other server-side support (presume so), you can use some image resizing codes to create a thumbnail image corresponding to each large image and store them in a seperate directory(using the same name will be helpful).

effpeetee
05-28-2007, 01:51 PM
Thank you to SouthwaterDave and abduraooft for your comments.
Yes I do intend to reduce the images and I do have the necessary software.

My main concern at the moment is - How many pictures per download and how to space them.

The program that I am using will automatically fill the screen at any normal setting. Are the pictures too close to each other. Should I put all the pictures on one menu, or should I have multiple menus?

Any feedback will be welcome.

http://www.exitfegs.co.uk/Picchoose.html is the URL.

Site still being developed. There are '100 plus' pictures to include.

effpeetee

effpeetee
05-28-2007, 04:07 PM
I have resized the images and uploaded them. I have renamed the thumbnails filename + "a" and altered the HTML accordingly
I still have the text to put right.

Try again?

http://www.exitfegs.co.uk/Picchoose.html

effpeetee



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum