slider.js是手机端触屏滑动幻灯片插件

slider.js是手机端触屏滑动幻灯片插件

slider是一款手机触屏可滑动带指示的jquery幻灯片插件。

使用方式:

第一步引入bfwone 加载依赖项jquery

第二步use插件及css和主题css

完整示例代码如下

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0" name="viewport" />
    <title>BFW NEW PAGE</title>
    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/jquery-3.2.1.min.js"></script>
    <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/slider.css">
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/slider.js"></script>
  
</head>
<body>
    <div class="slider" data-ydui-slider>
        <div class="slider-wrapper">
            <div class="slider-item">
                <a href="javascript:;">
                    <img src="//repo.bfw.wiki/bfwrepo/image/607cc347dc162.png" alt="">
                </a>
            </div>
            <div class="slider-item">
                <a href="javascript:;">
                    <img src="//repo.bfw.wiki/bfwrepo/image/60665057b093d.png" alt="">
                </a>
            </div>
            <div class="slider-item">
                <a href="javascript:;">
                    <img src="//repo.bfw.wiki/bfwrepo/image/606acc8d088cc.png" alt="">
                </a>
            </div>
        </div>
        <div class="slider-pagination"></div>
        <div class="aui-banner-bg"></div>
    </div>
</body>
</html>



立即下载slider.js查看所有js插件

网友评论0

程序员在线工具箱