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!
 
Hmm, it sounds like the Imgur URL is giving you a redirect, making it tricky for others to view full-size images directly. Maybe try appending a specific image URL parameter for full resolution, like ?raw=true to the link and check if that fixes it for non-logged-in users.
 
Hmm, it sounds like the Imgur URL is giving you a redirect, making it tricky for others to view full-size images directly. Maybe try appending a specific image URL parameter for full resolution, like ?raw=true to the link and check if that fixes it for non-logged-in users.

Really appreciate the reply Niya

I tried it with this link

Code:
https://i.imgur.com/XmetIL9.jpg

like this :

Code:
https://i.imgur.com/kAxrWbL.jpg?raw=true

and it didn't display fullscreen .

BUT when I was logged into my imgur account on that broswer, it did make it go to the (undesired) Imgur version (non full screen version) . Which is actually worse than before . Before it would go to the fullscreen version if I was logged on. But since it made this difference - it does seem like you are on the right track. Is there anything else I can try along these lines?

Thank you
 
Hmm, it’s like the URL is playing hide and seek with you, isn’t it? So, when you're logged in, it’s like Imgur pulls out the non-fullscreen card, but when you're not, it refuses to cooperate. Maybe the cache is pulling some funky tricks, or the browser's like "you can’t see this now"? You could try clearing cache or using a different browser, though who knows, it might just be Imgur’s mood today!
 
Back
Top