Support for Drupal 7 is ending on 5 January 2025—it’s time to migrate to Drupal 10! Learn about the many benefits of Drupal 10 and find migration tools in our resource center.
Hey,
I love that the flexslider is responsive, and touch screen ready, but when the page loads, all slider images stack vertically until they all load, then it all quickly flicks into the slider.
This doesn't look great on page load, as it plays havoc with other page elements for a second or two.
Is there a way to only show the first slide on load, and let the other slides load hidden?
Comments
Comment #1
Anks CreditAttribution: Anks commentedHi chris,
Thanks for pointing the issue.
You can add css display:none to LI elements.
for example
<li class="slide" style="display:none;"><img src="<?php print $img1;?>"alt="Slide1"/></li>
It will solve the issue.
I will add this solution to next realease.
Comment #2
Collins405 CreditAttribution: Collins405 commentedAh, perfect, thanks mate.
Comment #3
algates CreditAttribution: algates commentedHi Collins405, I have added in css like below
But its not working, can you help me to fix this issue.
Comment #4
Collins405 CreditAttribution: Collins405 commented@algates Its been so long, I don't remember it now. Have you got a URL I can look at?
Comment #5
algates CreditAttribution: algates commented@Collins405 www.iopex.com look at this in firefox, slider image loading first, and again loading initial(first) image, and i have checked in slider li element also, its having display:block property, i dont know how could i change. Help me to fix it.
Comment #6
Collins405 CreditAttribution: Collins405 commented@algates That looks fine to me? Tested in Chrome and Firefox, and seems to be ok. There is a slight jump in the orange content box, as there is no set height on the slider. You could set different heights at css break points so the content doesn't jump around while the slider loads.
Comment #7
algates CreditAttribution: algates commented@Collins405 thanks for helping, actually i am worry about slider image loading, flex slider image loaded when page loads and got one flickering and load again, i think, it happened because of display:none|block property, kindly look at this collins pls.
Comment #8
MauroCacio CreditAttribution: MauroCacio commentedCiao Anks.
Il tuo tema è stupendo.
Non so è già è stato chiesto:
-come faccia ad aumentare di numero le slide della pagina iniziale, portandole da 3 originali a 5/6 ecc..
Grazie.
Ciao e ancora complimenti
MauroC