setInterval 函数的使用例子

setInterval() 是 JavaScript 内建函数，用来设置每隔一段时间执行一个函数。下面的例子，Vue中使用JavaScript 来实现过渡 transition的动画效果, 使用了这个函数：

methods: {beforeEnter(el) {console.log('beforeEnter&&&&&&7');console.log(el);el.style.opacity=0;},enter(el, done) {console.log("enter............");console.log(el);let round = 1;const interval = setInterval(function() {el.style.opacity = round * 0.01;round++;if (round > 100) {clearInterval(interval);done();}}, 20);  // 20 是20 毫秒},afterEnter(el) {console.log("after enter..........");console.log(el);},
}

一开始，设置 opacity = 0, 不透明度 opacity = 0，然后每隔 20 milliseconds 毫秒，执行一次 setInterval 里的 function。
opacity 从 0， 0.01， 0.02 一直增加到 1， round 达到 100， opacity 达到上限值 1，然后调用 clearInterval(interval); 清除interval退出函数。

setInterval 函数的使用例子相关推荐

在setInterval函数中传递参数
本文翻译自:Pass parameters in setInterval function Please advise how to pass parameters into a function c ...
setInterval函数的用法
我是想用canvas实现一个进度条,用到这个定时器setInterval,但是调用的函数只执行了一次. 定义: setInterval() 方法可按照指定的周期(以毫秒计)来调用函数或计算表达式. s ...
html里的swal添加倒计时,使用甜蜜警报插件的setInterval函数倒计时
我试图实现倒计时到sweetAlert.在不活动20分钟后,会弹出甜蜜警报并显示会话即将超时,并且用户有两种选择:注销或继续,这将重新启动空闲计时器.当鼠标移动或点击时,空闲计时器也会重置.我的问题是 ...
js停止setInterval函数的运行
在某些情况下,我们需要用到setInterval函数,让某方法在每隔固定时间段后自动执行. 可满足某些条件后我们需要将其终止,不再运行,做法如下: Auto=window.setInterval(&q ...
JS中的setTimeout和setInterval函数
目录前言 setTimeout setTimeout()函数应用之点名器 setInterval setInterval应用之重写点名器前言在生活中,常有定时做某事,或者循环做某事的需求,如设置 ...
解决setInterval函数传参问题
修改window.setInterval函数,使其可以接收参数 var __sto = setInterval; window.setInterval = function (callback, ti ...
setTimeOut函数和setInterval函数
setTimeout( )是设定一个指定等候时间 (单位是千分之一秒, millisecond), 时间到了, 浏览器就会执行一个指定的 method 或 function, 有以下语法: 今次例子是 ...
SqlServer时间函数的使用例子整理
为什么80%的码农都做不了架构师?>>> 整理SqlServer2008的时间函数如下: 1.获取系统时间 select getdate(); --2012-05-06 22: ...
matlab的fft函数写法,matlab的fft函数的使用例子
fs=1000;%对连续信号进行量化处理,即对原始信号进行采样,这里是采样率,单位Hz ts=1/fs;%采样间隔 t=0:ts:1.3; x=sin(2*pi*50*t)+sin(2*pi*300* ...

setInterval 函数的使用例子

setInterval 函数的使用例子相关推荐

最新文章

热门文章