滑块未以正确格式显示

Question

我是使用以下代码的显示滑块，但它不能滑动它显示为一张又一张的幻灯片图像。我将滑块图像存储在数据库中。对编码进行适当的更改。我正在使用 carousel-slider 显示滑块，但无法显示正确的格式。<section id="slider"><!--slider-->    <div class="container">        <div class="row">            <div class="col-sm-12">                <div id="slider-carousel" class="carousel slide" data-ride="carousel">                    <ol class="carousel-indicators">                        <li data-target="#slider-carousel" data-slide-to="0" class="active"></li>                    </ol>                    <div class="carousel-inner">                         <?php                         $all_slider_info=DB::table('tbl_slider')->where('publication_status',1)->get();                        ?>                         @foreach($all_slider_info as $slider)                        <div class="item active">                            <div class="col-sm-6">                                <h1><span>E</span>-SHOPPER</h1>                                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. </p>                                <button type="button" class="btn btn-default get">Get it now</button>                            </div>                            <div class="col-sm-6">                                <img src="{{$slider->slider_image}}" class="girl img-responsive" alt="" />                                <img src="{{$slider->slider_price_image}}"  class="pricing" alt="" />                            </div>                        </div>                         @endforeach                    </div>                    </a>                </div>            </div>        </div>    </div></section><!--/slider-->

Answer 1

可能的错误可能是使用了活动类。您的活动课程将添加到滑块的每张幻灯片中。所以它可能会导致问题。您的代码也缺少指标列表。根据您的代码，它将仅显示一个指示器而不是每张幻灯片

<section id="slider"><!--slider-->

<div class="container">

    <div class="row">

        <div class="col-sm-12">

            <div id="slider-carousel" class="carousel slide" data-ride="carousel">

                    <?php 

                    $all_slider_info=DB::table('tbl_slider')->where('publication_status',1)->get();

                    $tot = count($all_slider_info);

                    ?>

                <ol class="carousel-indicators">

                    <?php for($i=1;$<=$tot;$i++){ ?>

                        <li data-target="#slider-carousel" data-slide-to="{{$i}}" class="{{$i==1?'active':''}}"></li>

                    <?php } ?>

                </ol>

                <div class="carousel-inner">

                     @foreach($all_slider_info as $key=>$slider)

                    <div class="item {{$key==1?'active':''}}">

                        <div class="col-sm-6">

                            <h1><span>E</span>-SHOPPER</h1>

                            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. </p>

                            <button type="button" class="btn btn-default get">Get it now</button>

                        </div>

                        <div class="col-sm-6">

                            <img src="{{$slider->slider_image}}" class="girl img-responsive" alt="" />

                            <img src="{{$slider->slider_price_image}}"  class="pricing" alt="" />

                        </div>

                    </div>

                     @endforeach

                </div>

                <a href="#slider-carousel" class="left control-carousel hidden-xs" data-slide="prev">

                    <i class="fa fa-angle-left"></i>

                </a>

                <a href="#slider-carousel" class="right control-carousel hidden-xs" data-slide="next">

                    <i class="fa fa-angle-right"></i>

                </a>

            </div>

        </div>

    </div>

</div>