2016-02-18 63 views
0

这是一个幻灯片直接添加到WordPress的页面。我已经添加了样式表,脚本,幻灯片本身以及执行滑块功能的脚本,但我无法使其运行。我怎样才能得到这个jQuery脚本在WordPress上工作?

这是网页的代码:

 //PHP functions 
     wp_enqueue_style('slideshow', get_stylesheet_directory_uri() . '/css/slideshow.css', false, '1.1', 'all'); 
     wp_enqueue_script('jquery.cslider', get_stylesheet_directory_uri() . '/js/jquery.cslider.js', array ('jquery'), 1.1, true); 

     <div id="da-slider" class="da-slider"> 
      <div class="da-slide"> 
       <h2>1. Easy management</h2> 
       <p>Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts. Separated they live in Bookmarksgrove right at the coast of the Semantics, a large language ocean.</p> 
       <a href="#" class="da-link">Read more</a> 

       <div class="da-info"></div> 
       <div class="da-img da-bg1"></div> 
      </div> 

      <div class="da-slide"> 
       <h2>2. Revolution</h2> 
       <p>A small river named Duden flows by their place and supplies it with the necessary regelialia. It is a paradisematic country, in which roasted parts of sentences fly into your mouth.</p> 
       <a href="#" class="da-link">Read more</a> 

       <div class="da-info"></div> 
       <div class="da-img da-bg2"></div> 
      </div> 

      <div class="da-slide"> 
       <h2>3. Warm welcome</h2> 
       <p>When she reached the first hills of the Italic Mountains, she had a last view back on the skyline of her hometown Bookmarksgrove, the headline of Alphabet Village and the subline of her own road, the Line Lane.</p> 
       <a href="#" class="da-link">Read more</a> 

       <div class="da-info"></div> 
       <div class="da-img da-bg3"></div> 
      </div> 

      <div class="da-slide"> 
       <h2>4. Quality Control</h2> 
       <p>Even the all-powerful Pointing has no control about the blind texts it is an almost unorthographic life One day however a small line of blind text by the name of Lorem Ipsum decided to leave for the far World of Grammar.</p> 
       <a href="#" class="da-link">Read more</a> 

       <div class="da-info"></div> 
       <div class="da-img da-bg4"></div> 
      </div> 

      <nav class="da-arrows"> 
       <span class="da-arrows-prev"></span> 
       <span class="da-arrows-next"></span> 
      </nav> 
     </div> 

     <script type="text/javascript"> 
      jQuery(function() { 
       jQuery('#da-slider').cslider({ 
        autoplay : true, 
        bgincrement : 450 
       }); 
      }); 
     </script> 

这里是cslider's link

+0

请提供任何演示链接。 – saadeez

+0

欣赏它可能很难给一个完整的演示,因为它是一个wordpress构建。几乎没有什么特别的东西:get_stylesheet_directory_uri()为您提供了正确的目录(即,您是否在Chrome开发工具中看到了正确的文件,并且没有收到任何404错误)。文件版本名称是否正确/需要?你似乎在寻找文件版本1.1的CSS和JS - 是否正确?其中一个作为字符串('1.1')被另一个作为数字(1.1)传递,但我不确定这是否重要。 –

+0

查看您的jQuery版本 –

回答

1

因为滑块在内部使用Modernizer,所以您必须在cslider之前加载Modernizer库。当包含csliderwp_enqueue_script()函数时,最好的方法是通过Modernizer作为依赖关系。

0

@pgk你是对的,问题是Modernizr的脚本错过了,现在它的工作!非常感谢!!我必须更加关注Chrome开发工具...

+1

你好jos3m,也许你可以带@pgk把他的评论转换成答案,这样他会收到适当的信用,如果不是这样的话,请检查这个答案被接受为正确的结算。 –

+0

嗨克莱门斯,对不起我的无知,但我该怎么做? – jos3m

+0

问他是否可以转换它,他只需要回答而不是评论,并且您通过点击支票图标接受任何一个。 –

相关问题