Support

Support is part of Event Gallery Extended.

Please get a subscription if you need support. Feel free to use the ticket system or the contact form for reporting defects or pre-sale questions. Make sure you're logged in in order to be able to create a new ticket.

For general information you can also jump to the manual.

Subscribe now!

#3431 – In Lightbox the arrows work different

Posted in ‘Event Gallery Extended’
This is a public ticket. Everybody will be able to see its contents. Do not include usernames, passwords or any other sensitive information.
Tuesday, 29 January 2019 11:39 UTC
Frank_Bertram
 I noticed in the Lightbox the right and left arrows work differently depending on the template used.
The left and right arrows on the keyboard however work as expected, i.e. bring you to the previous or next Image in the album/event.
With the Protostar template the arrows on the screen work as expected.
With the Template I use for this website (ReBase Build by ReDim) both the right and left arrow on the screen have the same effect.
They bring you back to the album view where you came from as the <ESC>key on the keyboard does.

I also tested this with the Atomic, Beez2, Beez3 and Beez5 Templates. The all work as expected.

Also I noticed that the Zoom In/Out, Fullscreen, and Close(Esc) buttons are not shown.

Is there anything I can do to solve this other than use a different template?
Best Regards
Frank Bertram

Custom Fields

Event Gallery Version Event Gallery 3.10.12 (build 996df8e)
Joomla Version 3.9.2.
URL https://www.molenakkers.nl/
PHP Version 7.2.11
Tuesday, 29 January 2019 12:09 UTC
Frank_Bertram
I also noticed that another component (Imagesizer also by ReDim) which also uses a Lightbox,
has similar left and right arrows on the screen that operate as expected.
Regards Frank
Tuesday, 29 January 2019 18:00 UTC
sbluege
Hi,

can you provide a link where I can see this behavior? Your albums are not visible without a login.

Please note that this is a public ticket. Do not post credentials here.
 
Tuesday, 29 January 2019 18:35 UTC
Frank_Bertram
I will close this ticket and create a private one.
Best Regards
Frank
Tuesday, 29 January 2019 19:20 UTC
sbluege
Since this happens sometimes, I prefer answering on the public ticket.

I opened your demo link. The lightbox left/right arrow-buttons work as expected. But I noticed a CSS-issue with the template you're using.

This will fix the buttons in the top toolbar of the lightbox:
.pswp__button {
    width: 44px !important;
    height: 44px !important;
}

.pswp__button--close {
    background-position: 0 -44px !important;
}

.pswp__button--zoom {
    background-position: -88px 0 !important;
}
 
Thursday, 31 January 2019 15:27 UTC
Frank_Bertram
Hi Sven,

Thanks a lot for your fix.
You did not write where to put the CSS, but I guessed a file named Bootstrap-Overwrite in the template causing the problem would do the job.
And yes it did.
The top-toolbar is now shown.

You mentionned: "The lightbox left/right arrow-buttons work as expected "
But as far as I can see that is not the case.
Digging a bit further into this issue I found that the arrows work as expected in Google-Chrome; Edge and Internet Explorer but NOT in Firefox.
Which makes it much less a problem.

I will try and research the firefox issue a bit

Thanks again and Best Regards
Frank
Thursday, 31 January 2019 15:58 UTC
Frank_Bertram
I upgraded Firefox from 64.0.2 to 65.0 (latest version) but this makes no difference
Thursday, 31 January 2019 16:45 UTC
Frank_Bertram
Hi Sven,

I found it!!
In Firefox if you point exactly to one of the arrows and click it behaves as <ESC>.
If you point slightly above or under one of the arrows it behaves as expected an as all the other browsers.

Best Regards.
Thursday, 31 January 2019 19:44 UTC
sbluege
I guess my CSS-fix caused this. It made the button for prev/next too small.

.pswp__button {
    width: 44px !important;
    height: 44px !important;
}

button.pswp__button--arrow--left, button.pswp__button--arrow--right {
    width: 70px !important;
    height: 100px !important;
}

.pswp__button--close {
    background-position: 0 -44px !important;
}

.pswp__button--zoom {
    background-position: -88px 0 !important;
}

Attachment
31-01-_2019_20-38-03.png
 
Thursday, 31 January 2019 23:42 UTC
Frank_Bertram
Hi Sven,

I Applied your fix, that does the job.

Thanks a lot.

Best Regards
Frank
Friday, 01 February 2019 05:56 UTC
sbluege
Great! You're welcome.
 
This ticket is closed, therefore read-only. You can no longer reply to it. If you need to provide more information, please open a new ticket and mention this ticket's number.