zoukankan      html  css  js  c++  java
  • vue 跑马灯效果

    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="utf-8">
            <title></title>
        </head>
        <body>
            <div id="app">
                <div>{{msg}}</div>
                <button @click="lang">浪起来</button>
                <button @click="stop">别浪</button>

            </div>
        </body>
        <script src="vue.js"></script>
        <script>
            var vm=new Vue({
                el:'#app',
                data:{
                    msg:'猥琐发育,别浪~~~~',
                    intervalId:null
                },
                methods:{
                    lang() {
                        if(this.intervalId!=null) return;
                        this.intervalId=setInterval( () =>{
                            var start = this.msg.substring(0,1);
                            var end= this.msg.substring(1);
                            this.msg=end+start;
                        },400)
                        
                    },stop(){
                        clearInterval(this.intervalId)
                        this.intervalId=null;
                    }
                }})
        </script>

    </html>
  • 相关阅读:
    Android调用Webserive
    SSD算法思想和结构详解
    第五章-一起看决策树如何做出决策?
    第四章-朴素贝叶斯朴素吗?
    第三章-KNN(分类和回归算法模型)
    第二章-感知机
    第一章-统计学习方法概论
    c语言 宏定义和全局变量,认识循环语句
    运算符注意事项
    c语言的scanf函数注意事项
  • 原文地址:https://www.cnblogs.com/tiandlsd001/p/15242028.html
Copyright © 2011-2022 走看看