Solved Enlarge a Photo

Status
This thread has been Locked and is not open to further replies. Please start a New Thread if you're having a similar issue. View our Welcome Guide to learn how to use this site.

Dingus

Thread Starter
Joined
Apr 21, 2002
Messages
1,161
Hi everyone.
I'm looking to increase the size of an image from a thumbnail to a full screen image on a click.
I was thinking of something like:

<div class="thumbnail"><img src="Images/Landscapes/Barbi.JPG" alt="" width="100%" class="cards"/></a></div>

and using:

<script>
function myFunction() {
document.getElementById("thumbnail").width = "100%;
}
</script>

Or if there's an easier way.
Any ideas folks?
 

Noyb

Trusted Advisor
Spam Fighter
Joined
May 25, 2005
Messages
21,034
First Name
Jay
I use Irfanview as my default image viewer and basic image editor....
It can be set to view all images ... "fit to screen"

Click on any image to view "Full Screen" ..
Then the Right n Left mouse key scrolls thru the folder.
Esc or click the center mouse key (Scroll Wheel) to return to normal screen viewing

I really doubt that thumbnails will look good viewed at fullscreen ...
or enlarged to view at fullscreen.
 

Dingus

Thread Starter
Joined
Apr 21, 2002
Messages
1,161
Thanks Noyb.
I'm more looking to change to a better quality image when the click is done.
However, I want to avoid having to load a full new page for each thumbnail.
I'll have a look at Irfanview though.
 

Noyb

Trusted Advisor
Spam Fighter
Joined
May 25, 2005
Messages
21,034
First Name
Jay
Sorry to tell you that only in Hollywood .... (Abby on NCIS) ...
Can they enlarge a photo and get a higher quality image.

The rule is ...
If you enlarge an image twice as much ...
It will look like the same quality ... twice as far away.
 

Dingus

Thread Starter
Joined
Apr 21, 2002
Messages
1,161
Now had a look at your program Noyb. This is a viewer. Not quite what I'm looking for, but thanks.
This is a for a phtography site. I am a photographer and I know about enlarging images. Hence I want to make an image fill a screen. It doesn't have to be an enlargement of the thumbnail though. I would probably be another image of better quality.
The thing I'm trying to avoid, is having to build a seperate page for each full image.
 

Noyb

Trusted Advisor
Spam Fighter
Joined
May 25, 2005
Messages
21,034
First Name
Jay
Irfanview a Viewer and Basic Image Editor - without an Image Organizer.
It has many advantages ... When working with my Photoshop.
e.g... I can select several images of several types ... then with 2 clicks ..
Open them all in Photoshop.

Microsoft is not smart enough to know a photoshop file is an Image
 

Noyb

Trusted Advisor
Spam Fighter
Joined
May 25, 2005
Messages
21,034
First Name
Jay
The view setting I use ...
 

Attachments

cwwozniak

Trusted Advisor
Spam Fighter
Joined
Nov 28, 2005
Messages
65,177
First Name
Chuck
This is a for a phtography site. ... Hence I want to make an image fill a screen. It doesn't have to be an enlargement of the thumbnail though. I would probably be another image of better quality. The thing I'm trying to avoid, is having to build a seperate page for each full image.
You might consider requesting this discussion be moved to the Web Design & Development forum. It has been a few years, but I recall there being prewritten blocks of code available for different ways of viewing a series of thumbnails and getting a larger image by clicking the thumbnail.
 
Joined
Sep 5, 2007
Messages
2,310
First Name
Colin
You can do this simply or very complex.

A simple way would be with this code:

HTML:
<a href="FullSize.jpg"><img alt="thumb" src="thumb.jpg"></a>
Alternatively you could do it with jquery or lightbox there are several online tutorials for that
 

Dingus

Thread Starter
Joined
Apr 21, 2002
Messages
1,161
Colin I'm gonna look at that.
Jimin I do like the modal, but knowing nothing of it I'll need to spend some time learning it.

Thanks for helping for now.
 

Dingus

Thread Starter
Joined
Apr 21, 2002
Messages
1,161
For now Colin can you say the best way to include your code.
I have this just now:

<div class="gallery">

<div class="thumbnail"><img src="Images/Landscapes/Barbi.JPG" alt="" width="100%" /></div>
<div class="thumbnail"><img src="Images/Structures/ZRHhouse.JPG" alt="" width="100%" /></div>
<div class="thumbnail"><img src="Images/Transport/Old Train.jpg" alt="" width="100%" /></div>
<div class="thumbnail"><img src="Images/Macros/Little Toad.JPG" alt="" width="1386" /></div>

</div>

I've kept it to 4 images until I get this issue fixed.
 
Joined
Sep 5, 2007
Messages
2,310
First Name
Colin
What is the code in your thumbnail class? Post it here then I should be able to give you something to try.
 

Dingus

Thread Starter
Joined
Apr 21, 2002
Messages
1,161
Folk. After looking at Modal, I've decided to go that way.
Thanks for your help.
 
Status
This thread has been Locked and is not open to further replies. Please start a New Thread if you're having a similar issue. View our Welcome Guide to learn how to use this site.

Users Who Are Viewing This Thread (Users: 0, Guests: 1)

As Seen On
As Seen On...

Welcome to Tech Support Guy!

Are you looking for the solution to your computer problem? Join our site today to ask your question. This site is completely free -- paid for by advertisers and donations.

If you're not already familiar with forums, watch our Welcome Guide to get started.

Join over 807,865 other people just like you!

Latest posts

Staff online

Members online

Top