Question

我正在尝试使用jquery在WordPress中构建动态滑块，以加载动态画廊图像的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>

如您所见，我试图使用左右箭头元素来滑动加载的图像。

我在做什么错了？

Answer 1

我个人建议您尝试这个https://owlcarousel2.github.io/OwlCarousel2/demos/demos.html

它具有如此众多的属性，可用来满足您的要求。希望对您有帮助

试图建立一个jQuery滑块

1 个答案: