Page 1 of 1

Display an image full size (100%) within a site

Posted: Mon Dec 04, 2023 3:40 pm
by alan_sh
I have a site which has portfolios of pictures displayed in a photogallery. I am using a lightbox (fancybox) so that a user can click on a photo and see an expanded image. But this is not necessarily the full size of the image.

At the moment, they have to right click the expanded image and click 'open in a new tab' to see it full screen (with scroll bars etc.). It would be nice if there was a lightbox that allowed that without having to leave my site. Does anyone know if there is such a thing? Or a way to display the full sized (100% image) within my site?

Thanks for any ideas

Alan

Re: Display an image full size (100%) within a site

Posted: Mon Dec 04, 2023 3:44 pm
by Pablo
There are many different (third party) lightboxes so if fancybox does not work for you then you have many other options you can choose from.
https://www.wysiwygwebbuilder.com/lightboxes.html

Re: Display an image full size (100%) within a site

Posted: Mon Dec 04, 2023 3:57 pm
by alan_sh
They all seem to do much the same thing (from the demos).

Alan

Re: Display an image full size (100%) within a site

Posted: Mon Dec 04, 2023 4:09 pm
by Pablo
Then it looks like I have not found a lightbox that does what you want.

Re: Display an image full size (100%) within a site

Posted: Mon Dec 04, 2023 4:19 pm
by alan_sh
I've found the options here https://fancyapps.com/fancybox/api/opti ... le-options and I can set what I want, but then I have to hit the 'back' button to go back to the fancybox gallery.

So, I'm nearly there. Thanks for the pointers.

Alan

Re: Display an image full size (100%) within a site

Posted: Mon Dec 04, 2023 5:47 pm
by alan_sh
Well, it appears that no matter what text I put in the 'options' of a lightbox (and it can be gibberish), I get an image which I can expand to full screen but I need to hit the back button to exit it. Very weird. I need to look at the html produced (if I can). But that's for another day.

Alan

Re: Display an image full size (100%) within a site

Posted: Mon Dec 04, 2023 5:56 pm
by Pablo
This probably means that you have added invalid code, which breaks the script.

Re: Display an image full size (100%) within a site

Posted: Mon Dec 04, 2023 6:07 pm
by BaconFries
Perhaps the issue lies with the image being 100% (fullscreen) and the close button top right not insight so it can be clicked to close the image and take you back to the gallery.
As you can see from the example below there is a close button on the expanded image which does what it is meant too. Maybe you need to rethink about the image size so that the close button will be visible for use.
https://www.wysiwygwebbuilder.com/suppo ... cybox.html

Note the fancybox settings
Lightbox-->Fancybox-->Settings Add the size you wish
Example:

Code: Select all

width : 500,
height : 500
Also see the following:
http://fancybox.net/api

Re: Display an image full size (100%) within a site

Posted: Mon Dec 04, 2023 6:31 pm
by alan_sh
BF, I want to upload a full size image so that the users can view it at the size it was taken. Yes, I could resize it, but that's not the point. And no, there is no close button anywhere (but that's probably because I broke it)

Pablo, yes, it probably does break it, but I have no real idea of the syntax of the options, so I was just guessing.

Alan

Re: Display an image full size (100%) within a site

Posted: Mon Dec 04, 2023 6:33 pm
by Pablo
If you need, then I need to see what you have done.

Re: Display an image full size (100%) within a site

Posted: Mon Dec 04, 2023 6:38 pm
by alan_sh
I'll upload a sample (small) wbs file later. Thanks for looking.

Alan

Re: Display an image full size (100%) within a site

Posted: Mon Dec 04, 2023 7:09 pm
by crispy68
For example, mobiletouchgallery lightbox will open the image filling the screen assuming the image is big enough to begin with to fill the screen. Of course, how it looks depends on the image itself. Is it landscape or portrait? Most lightboxes will scale the image and keep the aspect ratio so it looks good and to avoid scrollbars.

Re: Display an image full size (100%) within a site

Posted: Mon Dec 04, 2023 7:23 pm
by BaconFries
Hi Alan Looking again think your issues could be related to what your trying to use from the url you have gave. The current version used in WWB is 1.3.4 whereas the link is for "Newer" versions see the following for all newer releases Releases ยท fancyapps/fancybox what this means any "newer" code is not compatible and will break the version in WWB. I am sure Pablo will give you a more better answer when he reviews your demo. For all extras that can be used in 1.3.4 see the url in my reply these shouldn't break anything.

Re: Display an image full size (100%) within a site

Posted: Mon Dec 04, 2023 9:07 pm
by alan_sh
Thanks. You could be right. I will upload something tomorrow. But it is knowing what to put in the options box. Is it just the command? Is it some code? The help doesn't really explain it.

Alan

Re: Display an image full size (100%) within a site

Posted: Tue Dec 05, 2023 10:20 am
by alan_sh
I;ve uploaded a small wbs program with one image which, when displayed, if you click on the picture displays it in a fancy box. However, in the options, I have put in an invalid command. Now, when you click on it, it shows the image full screen and you can click again to expand it to full size. This is exactly what I want except you have to hit the back button to close the image and go back to the web page. What I want is a small 'X' somewhere to close the image.

File is https://www.dropbox.com/scl/fi/x0riaqb2 ... vf6l8&dl=1

Any advice appreciated.

Alan

Re: Display an image full size (100%) within a site

Posted: Tue Dec 05, 2023 10:24 am
by Pablo
String values must have quotes.

Code: Select all

testing:off
should be

Code: Select all

testing:'off'

Re: Display an image full size (100%) within a site

Posted: Tue Dec 05, 2023 10:28 am
by alan_sh
Pablo,

That was deliberately wrong to induce the error mode you said earlier. Which produces almost what I want.

Is there an option within the fancybox options that DOES do what I want?

Alan

Re: Display an image full size (100%) within a site

Posted: Tue Dec 05, 2023 10:42 am
by Pablo
If the script fails, then the browser will fallback to its default behavior.
It's the same behavior as when using no lightbox at all.

I do not think fancybox (or any other lightbox) can do what you want.

Re: Display an image full size (100%) within a site

Posted: Tue Dec 05, 2023 12:31 pm
by alan_sh
OK, thank you.

Alan