Попытка построить слайдер jQuery - PullRequest
Новая
       6

Попытка построить слайдер jQuery

0 голосов
/ 01 марта 2019

Я пытаюсь построить динамический слайдер в WordPress, используя jquery для загрузки php-массива изображений динамической галереи, где я заранее не знаю, сколько изображений будет в слайдере.

Это код, который янаписал до сих пор. 

<script>
    $(document).ready(function() {

      //Slider
      $('.wp-post-image img').addClass('Slide'); //Add class to the gallery images
      $('.wp-post-image img').click(function() {
        var MyImageArray = <? wc_get_template('single-product/product-thumbnails.php');?>; 
        var focusImg = 1;   
        var imageHold = MyImageArray[focusImg];
        focusImg++;

        if(focusImg > 4) {//to be honest not sure about this number
            focusImg = 0;
        }
      });   
      $('.wp-post-image img').attr('src','imageHold');



      $('.Slide').css('position','absolute');

      $('#Slider_Arrow_Left').click(function() {
        $('.Slide').animate({'right':'+=500','easing':'swing'});
        $('.Slide').css('z-index','10000');

      });

      $('#Slider_Arrow_Right').click(function() {
        $('.Slide').animate({'left':'+=500','easing':'swing'}); 
        $('.Slide').css('z-index','10000');
      });

    }); //End jquery
</script>

Как видите, я пытаюсь использовать элементы со стрелками влево и вправо для скольжения загруженных изображений.

Что я делаю не так?

1 Ответ

0 голосов
/ 02 марта 2019

Я бы лично порекомендовал вам попробовать это https://owlcarousel2.github.io/OwlCarousel2/demos/demos.html

, так как у него так много свойств, благодаря которым вы можете достичь своих требований.Я надеюсь, что это поможет вам

...