Created
December 21, 2016 22:32
-
-
Save davidtrushkov/a8bdb87227db23b147ddc22136ebc330 to your computer and use it in GitHub Desktop.
Make Bootstrap Carousel Dynamic - Laravel 5.3
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<div id="carousel-example-generic" class="carousel slide" data-ride="carousel"> | |
<!-- Indicators --> | |
<ol class="carousel-indicators"> | |
@foreach( $trip->photos as $photo ) | |
<li data-target="#carousel-example-generic" data-slide-to="{{ $loop->index }}" class="{{ $loop->first ? 'active' : '' }}"></li> | |
@endforeach | |
</ol> | |
<!-- Wrapper for slides --> | |
<div class="carousel-inner" role="listbox"> | |
@foreach( $trip->photos as $photo ) | |
<div class="item {{ $loop->first ? ' active' : '' }}" > | |
<img src="{{ $photo }}" alt="{{ $trip->listing->name }}"> | |
</div> | |
@endforeach | |
</div> | |
<!-- Controls --> | |
<a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev"> | |
<span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span> | |
<span class="sr-only">Previous</span> | |
</a> | |
<a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next"> | |
<span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span> | |
<span class="sr-only">Next</span> | |
</a> | |
</div> |
Thank you.
Thank you.
Thanks!!!
i am new to laravel and website development .will you please tell me where we have to keep the file ,in laravel directory ,and where we have to keep our image
thank you
Thanks bro
Thanks so much
thanks a lot
Thank you
amazing
Thank you
@davidtrushkov, slider is working but next, prev buttons are not visible
Nice
Thank you!!!
Thank you!
what does the $loop->first mean because that part is confusing me
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Thank you. This was very helpfull