jQuery滑块在cakephp 3中不起作用

Question

我试图用CakePHP 3.4.5中的jQuery滑块解决此问题

我在每个不同的文件中都包含了jQuery和CSS脚本
例如$this->Html->script('jquery.pogo-slider.min.js') $this->Html->script('jquery-2.2.3.min.js') $this->Html->css('pogo-slider.min.css')

在文件src-> template-> home.ctp中 ，我已修改并编写

    <?php
       $gbr_banner1 = $this->Html->image('banner1.jpg');
       $gbr_banner2 = $this->Html->image('banner2.jpg');
       $gbr_banner3 = $this->Html->image('banner3.jpg');
       $gbr_banner4 = $this->Html->image('banner4.jpg');
     ?>

     <div class="pogoSlider" id="js-main-slider">
         <div class="pogoSlider-slide" data-transition="verticalSlide" data-duration="1000"  <?= $this->Html->style(['background-image' => $gbr_banner1]) ?>>
             <div class="pogoSlider-slide-element">
                  <h3>Title banner</h3>
             </div>
         <div>
         <div class="pogoSlider-slide" data-transition="verticalSlide" data-duration="1000"  <?= $this->Html->style(['background-image' => $gbr_banner2]) ?>>
             <div class="pogoSlider-slide-element">
                  <h3>Title banner</h3>
             </div>
         <div>
         <div class="pogoSlider-slide" data-transition="verticalSlide" data-duration="1000"  <?= $this->Html->style(['background-image' => $gbr_banner3]) ?>>
             <div class="pogoSlider-slide-element">
                  <h3>Title banner</h3>
             </div>
         <div>
         <div class="pogoSlider-slide" data-transition="verticalSlide" data-duration="1000"  <?= $this->Html->style(['background-image' => $gbr_banner4]) ?>>
             <div class="pogoSlider-slide-element">
                  <h3>Title banner</h3>
             </div>
         <div>
     </div>

然后我经过了测试，但没有用，但是我在没有CakePHP框架的情况下进行了测试，可以100％正常工作，

任何人都可以帮助我

Answer 1

将其添加到您的代码中（确保在加载所有必需文件后添加此代码），您需要初始化pogo-slider

<script>
 var mySlider = $("#js-main-slider").pogoSlider().data('plugin_pogoSlider');
</script>