基于jQuery图片旋转轮播切换特效代码

基于jQuery图片旋转轮播切换特效代码

一款jQuery图片卡片旋转轮播切换代码,可点击左右两边图片卡片或下方索引按钮控制多张卡片重叠旋转切换。

使用方法
需要用到的HTML代码

1
2
3
4
5
6
7
8
9
10
11
12
<div id="banner">
    <div id="carousel">
        <img src="images/1.png" data-url="#">
        <img src="images/2.png" data-url="#">
        <img src="images/3.png" data-url="#">
        <img src="images/4.png" data-url="#">
        <img src="images/5.png" data-url="#">
        <img src="images/6.png" data-url="#">
        <img src="images/7.png" data-url="#">
        <img src="images/8.png" data-url="#">
    </div>
</div>

Javascript代码

1
2
3
4
5
6
7
8
9
10
11
<script src="js/jquery-1.11.0.js" type="text/javascript" charset="utf-8"></script>
<script src="js/slider.js" type="text/javascript" charset="utf-8"></script>
<script>
    $(function() {
        $('#carousel').carousel({
            curDisplay: 0, //默认索引
            autoPlay: false, //是否自动播放
            interval: 3000 //间隔时间
        });
    });
</script>
当前内容只有登录了才能查看,如果您已经注册,请登录
0

发表评论