wowslider实现一个简洁幻灯片轮播图效果代码-html代码-BFW代码库

wowslider实现一个简洁幻灯片轮播图效果代码

代码语言：html

所属分类：幻灯片

代码描述：wowslider实现一个简洁幻灯片轮播图效果代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html>
<head>
   
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />

<link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/wowslider.css">
    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/jquery-3.2.1.min.js"></script>

</head>
<body style="background-color:#d7d7d7;margin:auto;padding:100px;">

    <div id="wowslider-container1">
        <div class="ws_images">
            <ul>
                <li><img src="//repo.bfw.wiki/bfwrepo/image/5d65ea7d8bc8b.png" alt="1" title="1" id="wows1_0"></li>
                <li><img src="//repo.bfw.wiki/bfwrepo/image/5d65ea7d8bc8b.png" alt="2" title="2" id="wows1_1"></li>
                <li><a href=""><img src="data1/images/3.jpg" alt="bootstrap carousel" title="3" id="wows1_2"></a></li>
                <li><img src="//repo.bfw.wiki/bfwrepo/image/5d65ea7d8bc8b.png" alt="4" title="4" id="wows1_3"></li>
            </ul>
        </div>
        <div class="ws_bullets">
            <div>
                <a href="#" title="1"><span><img src="//repo.bfw.wiki/bfwrepo/image/5d65ea7d8bc8b.png" alt="1">1</span></a>
                <a href="#" title="2"><span><img src="//repo.bfw.wiki/bfwrepo/image/5d65ea7d8bc8b.png" alt="2">2</span></a>
                <a href="#" title="3"><span><img src="//repo.bfw.wiki/bfwrepo/image/5d65ea7d8bc8b.png" alt="3">3</span></a>
                <a href="#" title="4"><span><img src="//repo.bfw.wiki/bfwrepo/image/5d65ea7d8bc8b.png" alt="4">4</span></a>
            </div>
        </div>
        <div class="ws_script" style="position:absolute;left:-99%"></div>
        <div class="ws_shadow"></div>
    </div>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/wowslider.js"></script>
    <script type="text/javascript">
        // -----------------------------------------.........完整代码请登录后点击上方下载按钮下载查看