вопрос
Здравствуйте! Нужна помощь со слайдером. Начал верстать получается такая беда:
А нужно так:
Код HTML:
Код в DLE в slaider.tpl:
Код в DLE в main.tpl:
Как исправить?
А нужно так:
Код HTML:
<div id="myCarousel" class="carousel slide" data-ride="carousel">
<!-- Wrapper for slides -->
<div class="carousel-inner">
<div class="item active">
<div class="car"><img src="img/1.jpg" alt=""/></div>
<div class="carousel-caption">
<h4><a href="#">Lorem ipsum dolor sit amet consetetur sadipscing</a></h4>
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat.</p>
</div>
</div>
<div class="item">
<div class="car"><img src="img/2.jpg" alt=""/></div>
<div class="carousel-caption">
<h4><a href="#">consetetur sadipscing elitr, sed diam nonumy eirmod</a></h4>
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat.</p>
</div>
</div>
<div class="item">
<div class="car"><img src="img/3.jpg" alt=""/></div>
<div class="carousel-caption">
<h4><a href="#">tempor invidunt ut labore et dolore</a></h4>
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat.</p>
</div>
</div><!-- End Item -->
<div class="item">
<div class="car"><img src="img/4.jpg" alt=""/></div>
<div class="carousel-caption">
<h4><a href="#">magna aliquyam erat, sed diam voluptua</a></h4>
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat.</p>
</div>
</div>
<div class="item">
<div class="car"><img src="img/5.jpg" alt=""/></div>
<div class="carousel-caption">
<h4><a href="#">tempor invidunt ut labore et dolore magna aliquyam erat</a></h4>
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat.</p>
</div>
</div>
</div>
<ul class="list-group col-sm-4">
<li data-target="#myCarousel" data-slide-to="0" class="list-group-item active"><h4>Коррекция бровей в домашних условиях</h4></li>
<li data-target="#myCarousel" data-slide-to="1" class="list-group-item"><h4>Подборка модных детских стрижек для...</h4></li>
<li data-target="#myCarousel" data-slide-to="2" class="list-group-item"><h4>Итальянский стиль</h4></li>
<li data-target="#myCarousel" data-slide-to="3" class="list-group-item"><h4>magna aliquyam erat, sed diam voluptua</h4></li>
<li data-target="#myCarousel" data-slide-to="4" class="list-group-item"><h4>tempor invidunt ut labore et dolore magna aliquyam erat</h4></li>
</ul>
<div class="carousel-controls">
<a class="left carousel-control" href="#myCarousel" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left"></span>
</a>
<a class="right carousel-control" href="#myCarousel" data-slide="next">
<span class="glyphicon glyphicon-chevron-right"></span>
</a>
</div>
</div>
Код в DLE в slaider.tpl:
<!-- Wrapper for slides -->
<div class="carousel-inner">
<div class="item active">
<div class="car"><img src="{image-1}" alt="{title}"/></div>
<div class="carousel-caption">
<h4><a href="{full-link}" title="{title}">{title}</a></h4>
<p>{short-story limit="292"}</p>
</div>
</div><!-- End Item -->
</div><!-- End Carousel Inner -->
<ul class="list-group col-sm-4">
<li data-target="#myCarousel" data-slide-to="0" class="list-group-item active"><h4>{title limit="40"}</h4></li>
</ul>
<!-- Controls -->
<div class="carousel-controls">
<a class="left carousel-control" href="#myCarousel" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left"></span>
</a>
<a class="right carousel-control" href="#myCarousel" data-slide="next">
<span class="glyphicon glyphicon-chevron-right"></span>
</a>
</div>
Код в DLE в main.tpl:
<div id="myCarousel" class="carousel slide" data-ride="carousel">
{custom category="1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,23,24,25,26,30,32," template="slaider" aviable="global" from="0" limit="5" cache="no" order="date"}
</div>
Как исправить?
