Question

我也是Laravel和Bootstrap的新手。

我正在尝试在轮播中显示数据库中的数据。

在数据库中，我用文本填充了几行，我想在每个幻灯片上显示每个行。当我单击箭头时，一行/幻灯片隐藏，另一行/幻灯片将显示。

现在，我得到的所有幻灯片之间都带有文字...我找不到一些可以做到这一点的javascript：

@foreach($cards as $card)

<div id="myCarousel" class="carousel slide" data-toggle="collapse" data-ride="carousel" data-interval="false">
    <div class="carousel-inner">


        <div class="carousel-item active">
            <div class="carousel-caption">
                <h3>...</h3>
                <p class="carousel_text">{{ $card->text }}</p>
            </div>
        </div>

    </div>

    <a class="carousel-control-prev" href="#myCarousel" 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="#myCarousel" role="button" data-slide="next">
        <span class="carousel-control-next-icon" aria-hidden="true"></span>
        <span class="sr-only">Next</span>
    </a>
</div>
@endforeach

您能不能请别人帮我这个忙？

Answer 1

尝试一下：

<div id="myCarousel" class="carousel slide" data-toggle="collapse" data-ride="carousel" data-interval="false">
    <div class="carousel-inner">
       <?php $index = 0; ?>
       @foreach($cards as $card)
          <div class="carousel-item {{ $index == 0 ? "active" : "" }}">
            <div class="carousel-caption">
                <h3>...</h3>
                <p class="carousel_text">{{ $card->text }}</p>
            </div>
        </div>
         <?php $index++; ?>
       @endforeach
    </div>

    <a class="carousel-control-prev" href="#myCarousel" 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="#myCarousel" role="button" data-slide="next">
        <span class="carousel-control-next-icon" aria-hidden="true"></span>
        <span class="sr-only">Next</span>
    </a>
</div>

让我知道这是否可行！谢谢。

在轮播Laravel中显示和隐藏上一个和下一个元素

1 个答案: