1949啦网--小小 痛苦,是因为能力和欲望不匹配造成的

微场景开发思路分析swiper的使用 音乐播放控制

<!DOCTYPE html>      <html lang="en">      <head>      <meta charset="utf-8">      <title>Swiper demo</title>      <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1">      <!-- Link Swiper's CSS -->      <link rel="stylesheet" href="../sw/css/swiper.min.css">      <link rel="stylesheet" href="../sw/css/animate.min.css">      <link rel="stylesheet" href="../sw/css/t01.css">      <!-- Demo styles -->      </head>      <body>      <!-- Swiper -->      <div class="swiper-container">      <div class="swiper-wrapper">      <!-- class都是一样的,想控制第一屏加一个class one -->      <div class="swiper-slide one">      <div class="top ani"      swiper-animate-effect="zoomInDown"      swiper-animate-duration='1s'      swiper-animate-delay="0.3s">      <img src="../sw/t09.jpg" alt="" >      </div>      <!-- 戒指区域开始 -->      <div class="mrth">      <img src="../sw/tu/t10.jpg" alt="" class="t10">      <img src="../sw/tu/t11.jpg" alt="" class="t11 ani" swiper-animate-effect="zoomInDown"      swiper-animate-duration='1s'      swiper-animate-delay="0.3s">      <img src="../sw/tu/t12.jpg" alt="" class="t12">      </div>      <!-- 戒指区域结束 -->      <!-- 底部字 -->      <div class="jrth">      <p>swiper-animate-duration 动画持续时间(单位秒)</p>      </div>      </div>      <div class="swiper-slide">第2屏</div>      <div class="swiper-slide">第3屏</div>      <div class="swiper-slide">第4屏</div>      </div>      <!-- Add Pagination -->      <div class="swiper-pagination"></div>      </div>      <!-- 自加音乐区域开始 -->      <div id="music">      <img src="../sw/t06.jpg" alt="" class="t06">      <img src="../sw/t07.gif" alt="" class="t07">      <!-- audio 音频 声音 autoplay自动播放   autoplay="autoplay -->      <audio src="../sw/mi/tm.mp3" preload="auto" loop="loop" class="aod " autoplay="autoplay"></audio>      </div>      <!-- 自加音乐区域结束 -->      <!-- Swiper JS -->      <script src="../sw/js/swiper.min.js"></script>      <script src="../sw/js/swiper.animate.min.js"></script>      <!-- Initialize Swiper -->      <script src="../sw/js/t08.js"></script>      <!-- <script src="../sw/js/t09.js"></script> -->      </body>      </html>

原文链接:https://www.qiquanji.com/post/7491.html

本站声明:网站内容来源于网络,如有侵权,请联系我们,我们将及时处理。

微信扫码关注

更新实时通知

作者:xialibing 分类:网页教程 浏览: