Widget:Carousel: Difference between revisions

From Jcastle.info
No edit summary
No edit summary
Line 1: Line 1:
<div class="container">
<div id="myCarousel" class="carousel slide">
<div id="myCarousel" class="carousel slide" data-ride="carousel" data-interval="4000" data-wrap="true">
    <ol class="carousel-indicators">
<!-- Indicators -->
    <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
<ol class="carousel-indicators">
    <li data-target="#myCarousel" data-slide-to="1"></li>
<li data-target="#myCarousel" data-slide-to="0" class="active"></li>
    <li data-target="#myCarousel" data-slide-to="2"></li>
<li data-target="#myCarousel" data-slide-to="1"></li>
    <li data-target="#myCarousel" data-slide-to="3"></li>
<li data-target="#myCarousel" data-slide-to="2"></li>
    <li data-target="#myCarousel" data-slide-to="4"></li>
<li data-target="#myCarousel" data-slide-to="3"></li>
    <li data-target="#myCarousel" data-slide-to="5"></li>
</ol>
    <li data-target="#myCarousel" data-slide-to="6"></li>
<!-- Wrapper for slides -->
    <li data-target="#myCarousel" data-slide-to="7"></li>
<div class="carousel-inner" role="listbox">
    <li data-target="#myCarousel" data-slide-to="8"></li>
<div class="item active">
    <li data-target="#myCarousel" data-slide-to="9"></li>
<img src="/smw/images/2/28/Himeji.jpg" width="900" height="208" />
    </ol>
<div class="carousel-caption">
    <!-- Carousel items -->
<p>Himeji Castle</p>
    <div class="carousel-inner">
</div>
    <div class="item active"><a href="/castle/1/"><img src="/smw/images/2/28/Himeji.jpg" alt="姫路城" /></a><span id="caption">姫路城</span></div>
</div>
    <div class="item "><a href="/castle/17/"><img src="/smw/images/c/c9/Akashi.jpg" alt="熊本城" /></a><span id="caption">熊本城</span></div>
<div class="item">
    <div class="item "><a href="/castle/75/"><img src="/smw/images/b/b5/Matsue.jpg" alt="竹田城" /></a><span id="caption">竹田城</span></div>
<img src="/smw/images/c/c9/Akashi.jpg" width="900" height="208" />
    <div class="item "><a href="/castle/18/"><img src="/smw/images/2/28/Himeji.jpg" alt="江戸城" /></a><span id="caption">江戸城</span></div>
<div class="carousel-caption">
    <div class="item active"><a href="/castle/1/"><img src="/smw/images/2/28/Himeji.jpg" alt="姫路城" /></a><span id="caption">姫路城</span></div>
<p>Akashi Castle</p>
    <div class="item "><a href="/castle/17/"><img src="/smw/images/c/c9/Akashi.jpg" alt="熊本城" /></a><span id="caption">熊本城</span></div>
</div>
    <div class="item "><a href="/castle/75/"><img src="/smw/images/b/b5/Matsue.jpg" alt="竹田城" /></a><span id="caption">竹田城</span></div>
</div>
    <div class="item "><a href="/castle/18/"><img src="/smw/images/2/28/Himeji.jpg" alt="江戸城" /></a><span id="caption">江戸城</span></div>
<div class="item">
    <div class="item "><a href="/castle/17/"><img src="/smw/images/c/c9/Akashi.jpg" alt="熊本城" /></a><span id="caption">熊本城</span></div>
<img src="/smw/images/b/b5/Matsue.jpg" width="900" height="208" />
    <div class="item "><a href="/castle/75/"><img src="/smw/images/b/b5/Matsue.jpg" alt="竹田城" /></a><span id="caption">竹田城</span></div>
<div class="carousel-caption">
    </div>
<p>Matsue Castle</p>
    <!-- Carousel nav -->
</div>
    <a class="carousel-control left" href="#myCarousel" data-slide="prev">&lsaquo;</a>
</div>
    <a class="carousel-control right" href="#myCarousel" data-slide="next">&rsaquo;</a>
<div class="item">
    </div>
<img src="/smw/images/2/28/Himeji.jpg" width="900" height="208" />
<div class="carousel-caption">
<p>Himeji Castle</p>
</div>
</div>
</div>
<!-- Left and right controls -->
<a class="left carousel-control" href="#myCarousel" role="button" data-slide="pre">
<span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="right carousel-control" href="#myCarousel" role="button" data-slide="next">
<span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
</div>

Revision as of 23:09, 24 July 2017