enlarging picture

[Derek]

I'm new at this. I have a webpage with a few pictures on it. This is what
I want to accomplish. When you view a picture on my webpage I want to be
able to click on the picture and then another window opens and the picture
becomes much larger. For some reason right now when I click on my picture
it does not open another window and the picture does not get bigger.

What is the code to accomplish this. Visit my site at
http://members.rogers.com/derek1 and take a look at my code.

reply to newsgroup only.

Thank you in advance.

 

[Nico Schuyt]

For some reason right now
when I click on my picture it does not open another window and the
picture does not get bigger.
What is the code to accomplish this. Visit my site at
http://members.rogers.com/derek1 and take a look at my code.

In your links you point to files on your local PC:
<a href="http://members.rogers.com/derek1"><img src="c://wedding
homepage/029.jpg" width="400" height="350"></a>
<img src="file:///E:/001.jpg" width="600" height="364">
<img src="file:///E:/002.jpg" width="546" height="1106">

That doesn't work of course
Change in <mg src="029.jpg" ....> etc
Next problem: The 029.jpg has a size of about 1.6 MB! That's far too much.
Make the picture smaller (in a picture editor, *not* in HTML) and compress
the jpeg to reduce the size.
Regards, Nico

 

[Leslie]

I'm new at this. I have a webpage with a few pictures on it. This is what
I want to accomplish. When you view a picture on my webpage I want to be
able to click on the picture and then another window opens and the picture
becomes much larger. For some reason right now when I click on my picture
it does not open another window and the picture does not get bigger.

What is the code to accomplish this. Visit my site at
http://members.rogers.com/derek1 and take a look at my code.

Congratulations on your wedding, Derek!

Even on a cable modem your page took several minutes to load - too
long. Instead of 'resizing' your pictures using the width & height
attributes in HTML you should use a graphic editor to create thumbnail
size pics to post on the main page.

What works for me, in a graphic editor, is to copy of the original
then resize it to thumbnail size, There's no hard and fast rule about
what size a thumbnail should be, just make sure to make it small
enough to greatly reduce the file size, but large enough to be able to
see the details. Link the thumbnails to the larger version of the
picture.

You should also use the alt="" attribute in your image tags. Not only
is that 'good' HTML, but will allow visitors to know who is in the
pics.

Hope this helps,

Leslie

 

[Nico Schuyt]

You should also use the alt="" attribute in your image tags. Not only
is that 'good' HTML, but will allow visitors to know who is in the
pics.

Ehhh, that's not the intention of the alt attribute (though IE uses it for
that purpose). It is intended as a *replacement* in case pictures are not
available (text- or speech browsers for example).
Better: Use title="xxxxx"
Regards, Nico

 

[Janne Raiskila]

I'm new at this. I have a webpage with a few pictures on it. This is what
I want to accomplish. When you view a picture on my webpage I want to be
able to click on the picture and then another window opens and the picture
becomes much larger. For some reason right now when I click on my picture
it does not open another window and the picture does not get bigger.

What is the code to accomplish this. Visit my site at
http://members.rogers.com/derek1 and take a look at my code.

reply to newsgroup only.

Thank you in advance.

Here's the code for the link:

<a href="javascript:;"
onClick="window.open('pic.jpg','windowname','width=500,height=500,top=100,le
ft=100');">
<img src="thumbnail.gif">
</a>

 

[Chris Morris]

Here's the code for the link:

<a href="javascript:;"

Wrong, should be.
<a href="pic.jpg"

onClick="window.open('pic.jpg','windowname','width=500,height=500,top=100,le
ft=100');

Changing the above needs the following adding here
return false;

">
<img src="thumbnail.gif">

<img> requires an alt attribute, but this is even more important (more
important than essential doesn't make a lot of sense, I know) since
it's a link.

</a>

So,
<a href="pic.jpg" onClick="window.open('pic.jpg','windowname',
'width=500,height=500,top=100,left=100');return false;"><img
src="thumbnail.gif" alt="Lesser-spotted herring"></a>

Now works and makes sense for search engines, users without
Javascript, etc.

 

[Adrienne]

Gazing into my crystal ball I observed Chris Morris

<img> requires an alt attribute, but this is even more important (more
important than essential doesn't make a lot of sense, I know) since
it's a link.

<img src="thumbnail.gif" alt="<short description of photograph goes
here>">

<img src="thumbnail.gif" alt="short description of photo goes here">

Attributes do not need < > surrounding them, unless you meant ( )

 

[Janne Raiskila]

So,
<a href="pic.jpg" onClick="window.open('pic.jpg','windowname',
'width=500,height=500,top=100,left=100');return false;"><img
src="thumbnail.gif" alt="Lesser-spotted herring"></a>

Yeah, sorry. I was type of assuming that people had Javascript enabled.

<img> requires an alt attribute:
<img src="thumbnail.gif" alt="<short description of photograph goes

here>">

Maybe... You also might want to add the title-attribute

 

[Toby A Inkster]

<a href="pic.jpg" onClick="window.open('pic.jpg','windowname',
'width=500,height=500,top=100,left=100');return false;"><img
src="thumbnail.gif" alt="Lesser-spotted herring"></a>

Better:

<a href="pic.jpg" target="windowname" onClick="window.open(this.href,
this.target, 'width=500,height=500,top=100,left=100'); return false;"><img
src="thumbnail.gif" alt="Lesser-spotted herring"></a>

 

[Chris Morris]

Gazing into my crystal ball I observed Chris Morris

<img src="thumbnail.gif" alt="short description of photo goes here">

Attributes do not need < > surrounding them, unless you meant ( )

Sorry, I was trying to indicate that that text should be replaced by
something more appropriate to the specific image. It wasn't very
clear, was it...