Flexslider not working as expected <p>I have been having this strange problem with FlexSlider where I basically copy the code for a thumbnail slider from flexslider's <a href="http://flexslider.woothemes.com/thumbnail-slider.html" rel="nofollow">demo page</a> and I do a small modification for my needs but the carousel <strong>never</strong> synchronizes with the slider so it's useless. I've tried even the most basic example still not working as expected and no errors returned.</p> <p>I'll explain it below but you can check the "working" example <a href="https://www.casasenmeridabaspul.com/house-a/" rel="nofollow">here</a></p> <p>I include the css in my <code>&lt;head&gt;</code> section and the js in before the <code>&lt;/body&gt;</code> tag closure. I though the minified version might've been causing the problem so for this example I am including the full scripts.</p> <pre><code>in head &lt;link rel="stylesheet" href="js/flexslider/flexslider.css"&gt; before body tag close &lt;script src="js/flexslider/jquery.flexslider.js"&gt;&lt;/script&gt; </code></pre> <p>Then I have my slider and carousel the following way:</p> <pre><code>&lt;div class="flexslider slider_casas"&gt; &lt;ul class="slides"&gt; &lt;li&gt;&lt;img etc etc etc&gt;&lt;/li&gt; &lt;li&gt;&lt;img etc etc etc&gt;&lt;/li&gt; ........ &lt;/ul&gt; &lt;/div&gt; &lt;div class="flexslider carousel_casas"&gt; &lt;ul class="slides"&gt; &lt;li&gt;&lt;img etc etc etc&gt;&lt;/li&gt; &lt;li&gt;&lt;img etc etc etc&gt;&lt;/li&gt; ........ &lt;/ul&gt; &lt;/div&gt; </code></pre> <p>In the end, for the initialization (after I've included flexslider.js), I use the following:</p> <pre><code>&lt;script&gt; $(window).load(function() { $('.carousel_casas').flexslider({ animation: "slide", controlNav: false, animationLoop: true, itemWidth: 140, itemMargin: 10, asNavFor: ".slider_casas" }); $('.slider_casas').flexslider({ animation: "fade", controlNav: false, animationLoop: true, sync: ".carousel_casas", slideshowSpeed: 4000, animationSpeed: 600, slideshow: false }); }); &lt;/script&gt; </code></pre>