Hello.

I am using D7, bootstrap 3.0 theme with jquery update set to 1.10.

When I run a fresh page load, or clear caches my flexslider just shows a thin white line (the flexslider border padding) and none of the images.
When I look into it with firebug I can see that line 40 in the flexslider.css, found in the library is adding a display: none; to the li.

Here is what that line looks like:
.flexslider .slides > li {display: none; -webkit-backface-visibility: hidden;} /* Hide the slides before the JS is loaded. Avoids image jumping */

Solutions I have tried include commenting that out, which on a reload does not cause the first image to be skipped, but trades one issue for another.
Instead of none of the images showing, commenting out the line causes all images to show stacked, with no slideshow functionality.

I now have added the line
.flexslider .slides > li:first-child { display: block;}
which makes the first image appear on fresh loads, but no slideshow functionality is present. This is not a great solution for my clients, since only one image shows until the page is refreshed.

This is the same with straight Flexslider, and with Views slideshow Flexslider

Thanks in advance for any help you can provide.

Comments

jeepster’s picture

I fixed changing the Jquery Update default version from 1.9 to 1.7. Hope this help.

bradallenfisher’s picture

I need to load jquery 1.10+ on the front end of my site for various other reasons...

Are there any plans to allow this module to work with 1.10?
My issue is that when I flush caches or log in for the first time the flexslider is not displayed until refresh. Obviously not a deal breaker but would like to know of a solution or a fix. I can help test if someone can point me in the right direction. Thanks!