查看: 9326|回复: 8
打印 上一主题 下一主题

swiper animate 问题(没有动画效果)大神进来看看

[复制链接]

该用户从未签到

1

主题

4

帖子

15

积分

新手上路

Rank: 1

积分
15
跳转到指定楼层
楼主
发表于 2017-4-9 13:13:59 | 只看该作者 回帖奖励 |倒序浏览 |阅读模式
  1. <!doctype html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>无标题文档</title>
  6. <link rel="stylesheet" type="text/css" href="js/swiper/swiper-3.4.2.min.css">
  7. <link rel="stylesheet" type="text/css" href="js/swiper/animate.min.css">
  8. </head>
  9. <body>
  10.         <div class="swiper-container">
  11.             <div class="swiper-wrapper">
  12.                 <div class="swiper-slide">
  13.                            <p class="ani" swiper-animate-effect="bounceInLeft" swiper-animate-duration="2s" swiper-animate-delay="0.1s">Page1</p>       
  14.             </div>
  15.         </div>
  16.     </div>
  17.         <script src="js/swiper/swiper-3.4.2.min.js"></script>
  18.         <script src="js/swiper/swiper.animate1.0.2.min.js"></script>
  19.     <script>
  20.         var mySwiper = new Swiper ('.swiper-container',{
  21.                 pagination: '.swiper-pagination',
  22.                 onInit:function(swiper){
  23.                         swiperAnimateCacher(swiper);//隐藏动画元素
  24.                         swiperAnimate(swiper);//初始化完成开始动画
  25.                         },
  26.                 onSlideChangeEnd:function(swiper){
  27.                         swiperAnimate(swiper);//每个slide切换结束时也运行当前的slide动画
  28.                         }
  29.                 })
  30.                 </script>
  31. </body>
  32. </html>
复制代码
求大神们帮忙看看,照着官网写的,但是没有任何动画效果,不知道哪里出了问题,我在DW里面写的 没有自动索引到 ani 这个类 只有 animate 这个类。 但是改成 animate 也没有任何动画效果
分享到:  QQ好友和群QQ好友和群 QQ空间QQ空间 腾讯微博腾讯微博 腾讯朋友腾讯朋友
收藏收藏 分享分享 分享淘帖
回复

使用道具 举报

该用户从未签到

1

主题

4

帖子

15

积分

新手上路

Rank: 1

积分
15
沙发
 楼主| 发表于 2017-4-9 13:15:00 | 只看该作者
萌新一枚,刚学习前端,第一次使用 swiper 表示一脸懵逼,求大神们指出错误
回复 支持 反对

使用道具 举报

  • TA的每日心情
    开心
    2017-4-10 18:13
  • 签到天数: 1 天

    [LV.1]初来乍到

    0

    主题

    4

    帖子

    8

    积分

    新手上路

    Rank: 1

    积分
    8
    板凳
    发表于 2017-4-10 18:00:56 | 只看该作者
    js方法调用没错,可能你的js引入进来,有问题,还是可能就是你js版本不对
    回复 支持 反对

    使用道具 举报

  • TA的每日心情
    郁闷
    2018-3-6 10:23
  • 签到天数: 1 天

    [LV.1]初来乍到

    1

    主题

    5

    帖子

    13

    积分

    新手上路

    Rank: 1

    积分
    13
    地板
    发表于 2018-3-6 10:29:32 | 只看该作者
    本帖最后由 638340 于 2018-3-6 10:55 编辑

    同求,我的是循环一次后才不出来的,而且还会延迟好长时间才会出现,第一遍都是好的,只会在IOS 6上面出现,安卓还是好的
    回复 支持 反对

    使用道具 举报

  • TA的每日心情

    4 天前
  • 签到天数: 283 天

    [LV.8]以坛为家I

    16

    主题

    338

    帖子

    3197

    积分

    论坛元老

    Rank: 8Rank: 8

    积分
    3197
    QQ
    5#
    发表于 2018-3-8 17:27:26 | 只看该作者
    ani标签有没有添加绝对定位?
    回复 支持 反对

    使用道具 举报

    该用户从未签到

    0

    主题

    2

    帖子

    7

    积分

    新手上路

    Rank: 1

    积分
    7
    6#
    发表于 2018-5-17 14:29:41 | 只看该作者
    xudong 发表于 2018-3-8 17:27
    ani标签有没有添加绝对定位?

    如果用了会怎样?
    回复 支持 反对

    使用道具 举报

    该用户从未签到

    0

    主题

    1

    帖子

    4

    积分

    新手上路

    Rank: 1

    积分
    4
    7#
    发表于 2018-7-28 19:20:25 | 只看该作者
    重新倒了js和css文件就没问题了,你的文件应该有问题
    回复 支持 反对

    使用道具 举报

  • TA的每日心情
    奋斗
    2018-8-16 17:47
  • 签到天数: 3 天

    [LV.2]偶尔看看I

    0

    主题

    11

    帖子

    34

    积分

    新手上路

    Rank: 1

    积分
    34
    8#
    发表于 2018-8-15 17:51:01 | 只看该作者
    你的问题解决了么?animate的css和js都加载成功了,就是没有动画效果
    回复 支持 反对

    使用道具 举报

    您需要登录后才可以回帖 登录 | 立即注册

    本版积分规则

    Archiver|手机版|小黑屋|Swiper中文网 ( 粤ICP备15001020号

    GMT+8, 2024-4-27 03:37 , Processed in 0.074581 second(s), 30 queries .

    Powered by Discuz! X3.2

    © 2001-2013 Comsenz Inc.

    快速回复 返回顶部 返回列表