jQuery教程 ck-slide图片轮播详解-职坐标

jQuery教程 ck-slide图片轮播详解

沉沙 2018-09-18 来源：阅读 1260 评论 0

摘要：本篇教程介绍了jQuery教程 ck-slide图片轮播详解，希望阅读本篇文章以后大家有所收获，帮助大家对jQuery的理解更加深入。

本篇教程介绍了jQuery教程 ck-slide图片轮播详解，希望阅读本篇文章以后大家有所收获，帮助大家对jQuery的理解更加深入。

   ck_slide 是一款小清新的jQuery 幻灯片插件，它非常小巧，压缩后仅 3KB，基本功能可以满足。它支持淡入淡出/左右滚动、箭头/圆点控制、自动播放。

默认(淡入淡出)
左右滚动
自动播放

使用方法

<div class="ck-slide">
    <ul class="ck-slide-wrapper">
        <li>
            <a href="#"><img src="images/1.jpg" alt=""></a>
        </li>
        ...
    </ul>

    <a href="javascript:" class="ctrl-slide ck-prev">上一张</a> <a href="javascript:" class="ctrl-slide ck-next">下一张</a>

    <div class="ck-slidebox">
        <div class="slideWrap">
            <ul class="dot-wrap">
                <li class="current"><em>1</em></li>
                <li><em>2</em></li>
                <li><em>3</em></li>
                <li><em>4</em></li>
                <li><em>5</em></li>
            </ul>
        </div>
    </div>
</div>
$('.ck-slide').ckSlide();