Static front page full screen slider disappears after viewing in a lightbox

This is my first Wordpress site. Great theme aThemes. I’ve come to understand quite a bit in a short time, but now I’m stumped. My front page image disappears and shows white when I go back to the top of the page after viewing a few photos in Responsive Lightbox from dfactory. When I reload the page it comes back.

It was working fine for weeks. And now I’m not sure what is happening.

Thanks in advance for your help and time.

The title should say after viewing a PHOTO in a lightbox

Hello Marc-Andre,

I have just checked your website in Chrome and Firefox but I didn’t notice the issue that you described. Have you already resolved your issue?

Kind Regards, Roman.

Hi Roman, Thanks for getting back to me. No, nothing has changed in either Chrome, Safari or Firefox. Mobiles are not affected.

Every time:

1 - I go to photos section
2 - I click on a photo thumbnail and view 4-5 photos
3 - Scroll up the page and Blank.

Hi,

I don’t see the issue either. Try clearing your cache from both the browser and your caching plugin, perhaps there was some update in the gallery plugin you’re using and you’re seeing old code.

Hi Vlad, thanks for checking also. I have made a screen video of the emptying cache, cookies and recreating the problem.

What email address can I reach you at so I can send you an invitation to view this private video?

Again, thank you

vlad[at]athemes.com

Though it probably won’t help much as we can’t debug the issue without seeing it. Just to confirm, your browsers are up to date?

Thanks, yes all browsers on my 2 computers are up to date.

I’ve sent you an invitation through youtube.

Hi,

Actually, the video helped. I noticed that you were using the keyboard arrows to scroll through the photo gallery. If you click on the arrows under the images to scroll, it doesn’t happen.

Use this please in your child’s stylesheet:


.slides-container .slide-item {
       opacity: 1 !important;
}

Remember that if you add more images to your header slider, you’ll have to remove this code and the issue will probably not show anymore.

Wow, thank you so much, that one line made it work again!

Have you found where the problem is coming from? What is overriding the element.style that would cause an opacity value change?

It’s basically a shortcoming of the header slider script. You stopped it since you have a single image and thus doesn’t slide automatically anymore, however it can still slide by using the keyboard arrows. So once you hit the arrow key it changes the opacity for the first image to 0 and tries to go and display the next one, which doesn’t exist.

Thanks for your answer, I really appreciate it. Great support for a free version of a theme!

Will you change the header script in a future update?

I ask because if you do, won’t this CSS cause a problem?

I guess we should change it. The fix won’t cause a problem though, that’s what we’re probably going to use in the theme anyway, with the addition that it would only apply if the slider is stopped. Only other way would be to disable the keyboard navigation which I’m thinking that some people might use, so it’s not really an option. So you need to worry about it only if you add more images, in which case you need to remove the code.

Ok, great thank you Vlad. I won’t hesitate to come on the forums again for help, top notch!

Have a great day

Happy to help. Ratings are appreciated if you enjoy the theme: https://wordpress.org/themes/sydney/

Done. 5 stars for 5 star support!

Thank you.