Templat: BootstrapCarousel: Perbedaan antara revisi
Dari GBI Danau Bogor Raya
kTidak ada ringkasan suntingan |
k upd |
||
| (1 revisi perantara oleh pengguna yang sama tidak ditampilkan) | |||
| Baris 1: | Baris 1: | ||
<div id="myCarousel" class="carousel slide m-0 {{{addclass|}}}" data-bs-ride=" | <div id="myCarousel" class="carousel slide m-0 {{{addclass|}}}" data-bs-ride="carousel" data-bs-interval="{{{slideinterval|3000}}}" data-bs-pause="hover"> | ||
<!-- Indicators --> | <!-- Indicators --> | ||
<ol class="carousel-indicators | <ol class="carousel-indicators" style="list-style-type: none;"> | ||
{{#ifexpr: {{{slidecount|5}}}>=1 | <li data-bs-target="#myCarousel" data-bs-slide-to="0" class="active" style="width: 10px; height: 10px; border-radius: 100%;"></li>}}<!-- | {{#ifexpr: {{{slidecount|5}}}>=1 | <li data-bs-target="#myCarousel" data-bs-slide-to="0" class="active" aria-current="true" <!--style="width: 10px; height: 10px; border-radius: 100%;"-->></li>}}<!-- | ||
-->{{#ifexpr: {{{slidecount|5}}}>=2 | <li data-bs-target="#myCarousel" data-bs-slide-to="1 | -->{{#ifexpr: {{{slidecount|5}}}>=2 | <li data-bs-target="#myCarousel" data-bs-slide-to="1" ></li>}}<!-- | ||
-->{{#ifexpr: {{{slidecount|5}}}>=3 | <li data-bs-target="#myCarousel" data-bs-slide-to="2 | -->{{#ifexpr: {{{slidecount|5}}}>=3 | <li data-bs-target="#myCarousel" data-bs-slide-to="2" ></li>}}<!-- | ||
-->{{#ifexpr: {{{slidecount|5}}}>=4 | <li data-bs-target="#myCarousel" data-bs-slide-to="3 | -->{{#ifexpr: {{{slidecount|5}}}>=4 | <li data-bs-target="#myCarousel" data-bs-slide-to="3" ></li>}}<!-- | ||
-->{{#ifexpr: {{{slidecount|5}}}>=5 | <li data-bs-target="#myCarousel" data-bs-slide-to="4 | -->{{#ifexpr: {{{slidecount|5}}}>=5 | <li data-bs-target="#myCarousel" data-bs-slide-to="4" ></li>}}<!-- | ||
-->{{#ifexpr: {{{slidecount|5}}}>=6 | <li data-bs-target="#myCarousel" data-bs-slide-to="5 | -->{{#ifexpr: {{{slidecount|5}}}>=6 | <li data-bs-target="#myCarousel" data-bs-slide-to="5" ></li>}}<!-- | ||
-->{{#ifexpr: {{{slidecount|6}}}>=7 | <li data-bs-target="#myCarousel" data-bs-slide-to="6 | -->{{#ifexpr: {{{slidecount|6}}}>=7 | <li data-bs-target="#myCarousel" data-bs-slide-to="6" ></li>}}<!-- | ||
-->{{#ifexpr: {{{slidecount|6}}}>=8 | <li data-bs-target="#myCarousel" data-bs-slide-to="6 | -->{{#ifexpr: {{{slidecount|6}}}>=8 | <li data-bs-target="#myCarousel" data-bs-slide-to="6" ></li>}}<!-- | ||
-->{{#ifexpr: {{{slidecount|6}}}>=9 | <li data-bs-target="#myCarousel" data-bs-slide-to="6 | -->{{#ifexpr: {{{slidecount|6}}}>=9 | <li data-bs-target="#myCarousel" data-bs-slide-to="6" ></li>}}<!-- | ||
-->{{#ifexpr: {{{slidecount|6}}}>=10 | <li data-bs-target="#myCarousel" data-bs-slide-to="6 | -->{{#ifexpr: {{{slidecount|6}}}>=10 | <li data-bs-target="#myCarousel" data-bs-slide-to="6" ></li>}} | ||
</ol> | </ol> | ||
| Baris 18: | Baris 19: | ||
<li class="carousel-control-prev rounded p-0" style="top:45%; height: 15%; width: 10%; left: 0em; <!--background: rgba(0, 0, 0, 0.3);-->" data-bs-target="#myCarousel" role="button" data-bs-slide="prev"> | <li class="carousel-control-prev rounded p-0" style="top:45%; height: 15%; width: 10%; left: 0em; <!--background: rgba(0, 0, 0, 0.3);-->" data-bs-target="#myCarousel" role="button" data-bs-slide="prev"> | ||
<span class="carousel-control-prev-icon" aria-hidden="true"></span> | <span class="carousel-control-prev-icon" aria-hidden="true"></span> | ||
<span class=" | <span class="visually-hidden">Previous</span> | ||
</li> | </li> | ||
<li class="carousel-control-next rounded p-0" style="top:45%; height: 15%; width: 10%; right: 0em; <!--background: rgba(0, 0, 0, 0.3);-->" data-bs-target="#myCarousel" role="button" data-bs-slide="next"> | <li class="carousel-control-next rounded p-0" style="top:45%; height: 15%; width: 10%; right: 0em; <!--background: rgba(0, 0, 0, 0.3);-->" data-bs-target="#myCarousel" role="button" data-bs-slide="next"> | ||
<span class="carousel-control-next-icon" aria-hidden="true"></span> | <span class="carousel-control-next-icon" aria-hidden="true"></span> | ||
<span class=" | <span class="visually-hidden">Next</span> | ||
</li> | </li> | ||
</ol> | </ol> | ||
Revisi terkini sejak 8 September 2024 20.48
- Previous
- Next
Dokumentasi templat
Pemakaian
{{BootstrapCarousel
| carouselid=myCarousel
| slidecount=
| slideinterval=
| slide1=
| slide2=
| slide3=
| slide4=
| slide5=
| slide6=
| slide7=
| slide8=
| slide9=
| slide10=
}}
- Catatan
slidecount |
diisi 1-5 (maksimal 5) |
slideinterval |
dalam milidetik (default 5000) |