美文网首页工作笔记
一段逐帧动画的js

一段逐帧动画的js

作者: 色即是猫 | 来源:发表于2019-07-12 09:13 被阅读0次

<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title>vue</title>

<link rel="stylesheet" type="text/css" href="css/main.css">

<script src="https://cdn.bootcss.com/vue/2.3.3/vue.js"></script>

<style type="text/css">

.tab{

width: 471px;

height: 1080px;

margin: 0 auto;

}

img{

width: 471px;

height: 1080px;

}

</style>

    </head>

    <body class="body1">

        <!--这是我们的View-->

    <div class="tab" id="tabe">

        <img src="img/mc1.png" id="img" />

    </div>

<script>

    //使用数组保存图片的地址

    var imgs=["img/mc1.png","img/mc2.png","img/mc3.png","img/mc4.png"];

    var index=0;

    function qiehuan(){

        document.getElementById("img").src=imgs[index];

        index++;

        if(index > 3){

            index=0;

        }

    }

    setInterval("qiehuan()",200);

</script>

</body>

</html>

相关文章

  • 一段逐帧动画的js

    vue .tab{ width: 471px; height...

  • Android 动画总结

    Android 中的动画可以分为以下几类: 逐帧动画 补间动画 属性动画 一、逐帧动画 逐帧动画的原理就是让一系列...

  • 安卓动画

    Android 中的动画可以分为以下几类: 逐帧动画 补间动画 属性动画 1、逐帧动画 逐帧动画的原理就是让一系列...

  • Android动画

    文章脑图 1、Android动画种类 逐帧动画、补间动画、属性动画 逐帧动画 逐帧动画的原理就是让一系列的静态图片...

  • Android 动画

    Android中动画分为三种: 逐帧动画 补间动画 属性动画 逐帧动画 逐帧动画类似于gif或是电影的原理,通过将...

  • Android动画之逐帧动画FrameAnimation

    1 逐帧动画介绍 视图动画由两部分组成,补间动画和逐帧动画,前面文章已经讲解了补间动画,下面讲解逐帧动画。Fram...

  • Android 动画锦集

    Android 动画可分为逐帧动画、补间动画、属性动画。使用传统的逐帧动画、补间动画可以实现 Android 基本...

  • Android 动画机制(一)

    逐帧动画(Frame Animation) 逐帧动画也叫Drawable Animation,是最简单最直...

  • 三、Android 动画机制

    A、逐帧动画(Frame Animation) 逐帧动画也叫Drawable Animation,最直观最简单的动...

  • Android属性动画解析,让天下没有难画的动画

    在属性动画出现之前,Android的动画包括逐帧动画、补间动画两种。逐帧动画类似于gif图片,一帧一帧的播放准备好...

网友评论

    本文标题:一段逐帧动画的js

    本文链接:https://www.haomeiwen.com/subject/cyvskctx.html