轮播控件不适用于动态幻灯片

时间:2020-07-27 19:01:08

标签: html css laravel carousel

轮播幻灯片运行良好,但只有第一个轮播正在与控件一起使用,其余的可以显示控件,但是尽管自动幻灯片适用于所有用户,但无法响应点击 enter image description here

刀片文件

@if($posts->count()>0)
        @foreach ($posts as $post)
           <div id="carouselExampleControls" class="carousel slide" data-ride="carousel">
                <div class="carousel-inner">
                  @if($post->images->count()>0)
                       @for($i=0;  $i< count($image = $post->images()->get()); $i++)
                            @if($i==0)
                                     <div class="carousel-item active">
                                          <img class="posts-img" src="/images/{{$image[$i]['image']}}" alt="first slide">  
                                    </div>
                                    
                                    @else

                                         <div class="carousel-item">
                                               <img class="posts-img" src="/images/{{$image[$i]['image']}}" alt="first slide">  
                                         </div>
                            @endif 

                       @endfor

                       
                   
                   @endif
                    
                          
                       
               </div>

            
                      <a class="carousel-control-prev" href="#carouselExampleControls" role="button" data-slide="prev">
                        <span class="carousel-control-prev-icon" aria-hidden="true"></span>
                        <span class="sr-only">Previous</span>
                      </a>

                      <a class="carousel-control-next" href="#carouselExampleControls" role="button" data-slide="next">
                        <span class="carousel-control-next-icon" aria-hidden="true"></span>
                        <span class="sr-only">Next</span>
                      </a>
   
           </div>                   
        @endforeach
    @endif


        

0 个答案:

没有答案