JQuery слайдер не работает в CakePHP 3

Я пытался решить эту проблему с помощью ползунка jQuery в CakePHP 3.4.5

Я включил 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 Framework, это нормально работает на 100%,

кто-нибудь может мне помочь, пожалуйста

1 ответ

Добавьте это в свой код (убедитесь, что вы добавляете его после загрузки всех необходимых файлов), вам нужно инициализировать pogo-slider

<script>
 var mySlider = $("#js-main-slider").pogoSlider().data('plugin_pogoSlider');
</script>
Другие вопросы по тегам