Flexslider不能在Wordpress中工作

Question

我正在更新wordpress網站並決定使用Flexslider作爲旋轉木馬，但圖像沒有顯示出來。我知道他們在那裏，因爲我可以在Chrome的調試控制檯中看到他們。

該網站是在這裏：http://in-iq-qa.co/

正如你所看到的，還有空flexslider和它下面的另一個傳送帶通過unslider供電。我只是想弄明白爲什麼沒有顯示。

<!-- flexslider --> 
<div class="flexslider"> 
    <ul class="slides"> 
     <li> 
      <div class='slideContentBox cover-stories cs-4 innovation-and-creativity spring-2015 z-featured-slider '> 
       <a href="http://in-iq-qa.co/innovation-and-creativity/cover-story-4/"><h2>The Heart of the Matter</h2></a> 

       <p> 
        Donald Casey Jr. drills down to the core of the constantly changing healthcare industry to discover the innovative ways Cardinal Health can position itself for dramatic growth and success.<a class="readMore" href="http://in-iq-qa.co/innovation-and-creativity/cover-story-4/" 
        title="Insigniam Quarterly links to: The Heart of the Matter">Read 
        More</a> 
       </p> 
      </div> 
      <!--end .slideContentBox--> 
      <img src="http://in-iq-qa.co/wp-content/uploads/2015/05/The-Heart-of-the-Matter.jpg" class="attachment-post-thumbnail wp-post-image" alt="Heart of the Matter | Insigniam Quarterly | Spring 2015" />       </a> 
     </li> 
     <li> 
      <div class='slideContentBox spring-2015 strategy z-featured-slider '> 
       <a href="http://in-iq-qa.co/strategy/unleash-culture-to-fuel-growth/"><h2>Unleash Culture to Fuel Growth</h2></a> 

       <p> 
        How to align the nine facets of corporate culture to drive performance.<a class="readMore" href="http://in-iq-qa.co/strategy/unleash-culture-to-fuel-growth/" 
        title="Insigniam Quarterly links to: Unleash Culture to Fuel Growth">Read 
        More</a> 
       </p> 
      </div> 
      <!--end .slideContentBox--> 
      <img src="http://in-iq-qa.co/wp-content/uploads/2015/05/Unleash-Culture-to-Fuel-Growth.jpg" class="attachment-post-thumbnail wp-post-image" alt="Unleash Culture to Fuel Growth" />       </a> 
     </li> 
     <li> 
      <div class='slideContentBox spring-2015 strategy z-featured-slider '> 
       <a href="http://in-iq-qa.co/strategy/growth-with-an-accent/"><h2>Growth with an Accent</h2></a> 

       <p> 
        From cheeseburgers to lattes, John Dawson understands how to transform domestic brands into successful international enterprises.<a class="readMore" href="http://in-iq-qa.co/strategy/growth-with-an-accent/" 
        title="Insigniam Quarterly links to: Growth with an Accent">Read 
        More</a> 
       </p> 
      </div> 
      <!--end .slideContentBox--> 
      <img src="http://in-iq-qa.co/wp-content/uploads/2015/05/GrowthWithAccent.jpg" class="attachment-post-thumbnail wp-post-image" alt="Growth with an accent | Insigniam Quarterly | Spring 2015" />       </a> 
     </li> 
     <li> 
      <div class='slideContentBox spring-2015 transform z-featured-slider '> 
       <a href="http://in-iq-qa.co/transform/growth-through-adversity-transforming-disaster-into-untold-success/"><h2>Growth Through Adversity: Transforming Disaster Into Untold Success</h2></a> 

       <p> 
        An interview with turnaround expert John Jastrem.<a class="readMore" href="http://in-iq-qa.co/transform/growth-through-adversity-transforming-disaster-into-untold-success/" 
        title="Insigniam Quarterly links to: Growth Through Adversity: Transforming Disaster Into Untold Success">Read 
        More</a> 
       </p> 
      </div> 
      <!--end .slideContentBox--> 
      <img src="http://in-iq-qa.co/wp-content/uploads/2015/05/growth-through-adversity.jpg" class="attachment-post-thumbnail wp-post-image" alt="Growth through adversity | Insigniam Quarterly | Spring 2015" />       </a> 
     </li> 
    </ul> 
</div> 
<!-- /flexslider --> 



$(window).load(function() { 
    $('.flexslider').flexslider({ 
     animation: "slide", 
     controlNav: "thumbnails" 
    }); 
}); 

Answer 1

嘗試移動你的初始化代碼

$('.flexslider').flexslider({ 
     animation: "slide", 
     controlNav: "thumbnails" 
    }); 

到的document.ready函數，而不是window.load。不確定是否是這樣，但我看不到任何其他問題。我的猜測是，window.load是在你的flexslider javascript被加載之前觸發的，並且它沒有找到該函數。