Question

我在一个部分中有一个OWL轮播，用这个PHP代码拉出图像。

<?php $count = get_option( 'posts_per_page' );
  the_widget( 'post_widget1', 'count='.$count.'&orderby=date' );
?>

我试图再次使用完全相同的代码显示另一个轮播，但在post_widget2中设置了一些不同的设置，所以目前我的代码看起来像：

<section class="vbox">
<section class="scrollable padder-lg">

<h4>New</h4><hr />

<?php 
$count = get_option( 'posts_per_page' );
the_widget( 'post_widget1', 'count='.$count.'&orderby=name' );
?>

</section>
</section>


<section class="vbox">
<section class="scrollable padder-lg">

<h4>New</h4><hr />

<?php 
$count = get_option( 'posts_per_page' );
the_widget( 'post_widget2', 'count='.$count.'&orderby=date' );
?>

</section>
</section>



<script src="owl-carousel/jquery-1.9.1.min.js"></script> 
<script src="owl-carousel/owl.carousel.js"></script>


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

  var owl = $("#owl-demo");
  var owl = $("#owl-demo2");


  owl.owlCarousel({

  items : 5, //10 items above 1000px browser width
  navigation : false,
  pagination : false,
  responsive : true,
  autoPlay : true,
  navigationText : ["<",">"]
  });

  $(".next").click(function(){
  owl.trigger('owl.next');
  })
  $(".prev").click(function(){
  owl.trigger('owl.prev');
})

});
</script>

旋转木马只会显示一次。我意识到这是因为php脚本只执行一次，我的问题是如何让它在同一页面上工作两次？

Answer 1

乍一看，你的问题似乎是javascript而不是PHP：

var owl = $("#owl-demo");
var owl = $("#owl-demo2");

你使用相同的变量名，所以它只会覆盖第一个。

使用php在一个页面上执行多个owl轮播

1 个答案: