轮播

<!--轮播 S-->
<div class="index-silder" id="index-silder">

</div>
<!--轮播 E-->
<script id="banners-tem" type="text/html">
    <div class="index-silder-hd">
        <ul class="clearfix">
        </ul>
    </div>
    <div class="index-silder-bd">
        <ul>
            <%for(var i in data.banners) {%>
            <li>
                <a href="<%=data.banners[i].url%>"><img src="<%=data.banners[i].thumb_path%>"/></a>
            </li>
            <%}%>
        </ul>
    </div>
</script>
<script>
$(function () {
    var url = '/rest-api/get-home-elements';
    $.ajax({
        type: 'get',
        url: url,
        dataType: 'json',
        success: function (res) {
             var banners_html = template('banners-tem', res);
             $('#index-silder').html(banners_html);
             
             //http://www.superslide2.com/TouchSlide/downLoad.html
             //http://www.superslide2.com/TouchSlide/param.html
             if (res.data.banners.length > 0) {
                    TouchSlide({
                        slideCell: "#index-silder",      //执行效果的对象，必须是id对象
                        titCell: ".index-silder-hd ul",  //导航元素对象
                        mainCell: ".index-silder-bd ul", //切换元素的包裹层对象
                        effect: "leftLoop",    //效果 || left：左滚动；|| leftLoop：左循环滚动；
                        autoPlay: true,        //自动运行
                        autoPage: true,        //自动分页
                    });
             }
        }
   });
});
</script>