Slider randomly collapses.
Hi,
The issues doesn't seem to be caused by missing pictures. When I limit the view to certain posts which I have checked, the collapsing still happens. I can't pinpoint when, it seems very random.
Also note that the slider contains 3 items per slide. If there is one missing photo, it simply displays an empty container but the slider doesn't collapse.
I set the transition to 1 second for now (instead of 5 seconds) for easier debugging.
I also removed 'Berichten' (= Posts) from the content selection, which is not used anymore on this site. This doesn't have any effect on the collapsing issue.
Any further ideas?
I run multiple tests on the view, changing each time something, in order to understand what's the issue. From what I gathered so far, it seems that there is an issue with the option "Preload images before transition" check this screenshot hidden link
I observed, in the network tab of the browser dev tools, that the transition starts as soon as the second page is loaded. It seems to not wait for the images to completely preload before the transition starts.
I'd like to take a copy of your website to check it further locally. Please let me know if that's ok with you. If, yes, I'll install a plugin(Duplicator or All In One Migration) to take the copy.
Hi Jamal,
It's ok to install a plugin to take a copy. I personally use WPvivid (already installed).
Note that the site is built using Oxygen Builder plugin (which disables the theme). After migrating the site, you'll probably need to do the following to make sure all works well on the frontend:
Oxygen > Settings > Security > Sign All Shortcodes > Start shortcodes signing process.
Thanks!
The issue was also reproduced on my local copy. I worked on it a couple of hours without finding out the real issue behind it.
I tried to check if it happens in a clean install, without Oxygen builder, but it was not reproduced.
I'll try again tomorrow in a clean install with the Oxigen builder and to see if it is a general compatibility conflict or if it only happens on your website.
Then, I'll escalate it to our 2nd Tier for further assistance. I'll keep you updated.
I just want to let you know that I am still working on this issue.
I tried the view in a new page on my local copy and I disabled the CSS cache from Oxygen and it was not reproduced anymore. I tried the same on your site and it did not fix the issue.
So, I installed the "Health check&troubleshooting" plugin to simulate this with a default theme and only Toolset plugins and it was still reproduced. Which rings a bell about the custom CSS styles in the view.
I'll check again in a clean install with the custom CSS, and also with Oxygen and the blank theme to see what will I get.
Hi Jamal,
Thanks for the update. I'm not sure if this is a CSS problem (I did some CSS changes too but the collapsing still happened), but I'm curious to the result of your test. The slider is flexbox based with custom CSS, all included in the view itself.
Thank you very much. Unfortunately, I still don't see the cause behind it.
We can work around it with custom CSS or Javascript, but I'd prefer to escalate it to our 2nd Tier for further analysis.
I'll get back to you as soon as possible.
Ok thanks. Meanwhile I changed the slider effects to a 'slide' effect instead of 'fade' effect. With that effect the collapse doesn't happen.
I can live with the other effect, so no hurry on my side for a fix. Let me know if you need any more info.
Thank you for this feedback and my apologies for the late reply. Our 2nd Tier is still working on this issue, but because it is somehow random, it is still difficult to find out the issue. But, once we got something we'll get back to you.
Thanks for the update. No hurry on my side.
Hello there! Our developers have the cause of this issue and they will address it in the upcoming version.
There is a race condition between the animation and the calculation of the new, upcoming page height. As the next page is added to a hidden container, sometimes it fails to properly calculate its dimensions. The solution is to introduce a short timeout so "the DOM settles" and calculations match reality.
In fact, the timeout already existed but carried on no delay as it was set to zero, just to trigger the effect after the new page was completely added to the hidden container. But apparently, that is not enough for this specific last page case.
The developers have also provided a patch. But it will work with Toolset Blocks 1.3.5 only. It WILL NOT WORK in any other plugin version. In recent changes we modified how we load the frontend assets including the affected one, hence we can not just replace the file I am including and have it loaded.
If you are still on Toolset Blocks 1.3.5, just unzip the file and upload the one it contains to replace the one with the same name under /embedded/res/js/.
hidden link
Hi Jamal. Thanks for the update.
So do I understand correctly, to use this fix I have to stay on Toolset Blocks 1.3.5 forever...?
And the problem will continue to exist newer versions (currently 1.4.1)?
I really appreciate the fix, but I'm not sure if never updating the plugin is the way to go.
My apologies for missing your last reply. That's not what I meant, the fix is now released within Toolset. I meant that the patch needs to be applied to that specific version.
Of course, you will need to update to the latest release. It is always recommended to test the update in a staging site before applying it to the production site.