WAIT: Slider (Nestable) reload

Bugs
1

Browser: Chrome 110
OS: macOS / Windows / Linux / etc.
URL: Link to a page that illustrates this issue
Video: Short screen recording that illustrates this issue (free tool: jam.dev)

https://jam.dev/c/ccbcf61f-7b01-402a-8270-b5e186fe1273

I have a Slider (Nestable) with some interactions.
When you load the page, it looks unconfigured like blocks until it loads completely.
This video was sent to me by a client. On my computer, it is also visible but the detail is minimal.
I don’t know if it is because of the quality of the internet connection or the speed of the PC.

But it is somewhat annoying since it is a display problem.

What can be done to prevent this from happening?

2

Hi Medi,
Thanks so much for your report!

Unfortunately, I cannot reproduce the issue either even if I set the network speed to “slow 3G” (which is super slow).

Have you tried whether it works better without the interactions?

Best regards,
timmse

3

I just tried it without interactions and it does it but much less.
It only does this the first time it loads. If we go to this page Slider fading – Bihotz Mujer and then go to the home page, you can see the delay it has. They are just a few thousandths.

4

I can’t see any delay :thinking:

I don’t know how I can help at this point, as I can’t begin to see the problem. I can only give you the standard debugging steps:

  1. deactivate lazy loading » test
  2. deactivate all plugins (without exception) » test again

If it works better, enable one plugin at a time and test again until you find the plugin that’s causing the issue.

5

Hi, same issue here - on two different website.

Using Slider (nestbar)

Pressing STRG+F5 brings the effect back on each page load.

page-load
page-load1610×697 36.1 KB

Disabling all addon does not have any effects. Another webserver - no effect.
A similar issue was reported 2021.

best Markus

6

Hey Markus,
Can you provide me with a live link?

7

Hi Markus,
Thanks for the live link (via DM).

The issue is most likely caused by the loading order of the styles, which we’re currently working on.
The splide default styles are loaded quite late, so there is a considerable delay when the page is called up.

Two attempts:

  1. add the splide styles link tag to header scripts (e.g. in Bricks settings):
    <link rel="stylesheet" id="bricks-splide-css" href="https://your-domain.com/wp-content/themes/bricks/assets/css/libs/splide.min.css" media="all">

  2. give your slider (the root) a fixed height corresponding to the slide’s height.
    Important: you can only do this using custom CSS, as the style » height setting is also applied to the slides. E.g. %root% { height: 60vh; }