What's new
HTML Forums | An HTML and CSS Coding Community

Welcome to HTMLForums; home of web development discussion! Please sign in or register your free account to get involved. Once registered you will be able to connect with other members, send and receive private messages, reply to topics and create your very own. Our registration process is hassle-free and takes no time at all!

Problem Displaying Images Full-Screen In HTML

RichNG

New member
I help run a forum where a user can view old magazine scans. There are a number of thumbnails and the user can click on a thumbnail and then see that magazine page full size.

This is basically the HTML it uses : (filenames are made up)

Code:
<a href="//Forum_Storage_Image1.jpg"> <img src="//Forum_Storage_Image1_Thumbnailjpg"></a>

This displays the image so it fill up the whole window and it can then be clicked to enlarge it.

However the forum software we use, only allows us to use 1MB images max. Which isn't really enough for a high quality scan. So I wanted to use image sharing site: Imgur instead

Like this :

Code:
<a href="https://i.imgur.com/Image1.jpg"> <img src="//Forum_StorageImage1_Thumbnailjpg"></a>

This only works properly (like before) when I am logged into my Imgur account, otherwise (e.g for everyone else) it will display the image on the Imgur site itself - smaller and with a border. It's also not obvious how to get the image full-size ( the only way I can get the proper zoomed in view is to right click on it and open in a new tab)

Please help me to display this image full size using Imgur. I would like it to work just the same as the first example. Thank you!
 
Back
Top