owlCarousel 旋转
<div class="tab_container">
<div class="tab_content_category_tabs_3">
<div class="row">
<div class="col-xs-12 col-md-12 xs-offset-0">
<div id="owl-demo" class="owl-carousel ">
<c:if test="${not empty banners_c.advertisement}">
<c:forEach items="${banners_c.advertisement}" var="banners_c">
<div class="item">
<a href="${banners_c.hrefUrl}" title="Read more">
<img src="${p_w_picpathHost}${banners_c.p_w_picpathUrl}" alt="Owl Image">
</a>
</div>
</c:forEach>
</c:if>
</div>
</div>
</div>
</div>
</div>
<content tag="myJavascript">
<script type="text/javascript">
jQuery().ready(function () {
$("#owl-demo").owlCarousel({
autoPlay: false,
items: 3,
itemsDesktop: [1199, 3],
itemsDesktopSmall: [980, 3],
itemsTablet: [768, 2],
itemsMobile: [480, 1],
slideSpeed: 1000,
paginationSpeed: 1000,
rewindSpeed: 1000,
navigationText: ["", ""],
navigation: true,
stopOnHover: true,
pagination: true
});
});
</script>
</content>
<linkhref="css/owl.carousel.css"rel="stylesheet"><linkhref="css/owl.theme.css"rel="stylesheet"><scriptsrc="js/jquery.min.js"></script><scriptsrc="js/owl.carousel.js"></script>2、HTML
<divid="owl-demo"class="owl-carousel"><div>1</div><div>2</div><div>3</div><div>4</div><div>5</div><div>6</div><div>7</div><div>8</div></div>3、JavaScript
$(function(){$('#owl-example').owlCarousel();});
格式就是div 里面 嵌套一个div
参考
http://www.dowebok.com/93.html#comments
声明:本站所有文章资源内容,如无特殊说明或标注,均为采集网络资源。如若本站内容侵犯了原著者的合法权益,可联系本站删除。