javascript 切换动画
function startMove(obj, json, fn) {
clearInterval(obj.timer);
obj.timer = setInterval(function() {
var bStop = true;
for (attr in json) {
var icur = 0;
icur = (attr == 'opacity') ? Math.round(getStyle(obj, attr) * 100) : parseInt(getStyle(obj, attr));
var iSpeed = (json[attr] - icur) / 8;
iSpeed = iSpeed > 0 ? Math.ceil(iSpeed) : Math.floor(iSpeed);
if (icur != json[attr]) {
bStop = false;
}
if (attr == 'opacity') {
obj.style.filter = 'alpha(opacity:' + (icur + iSpeed) + ')';
obj.style.opacity = (icur + iSpeed) / 100;
} else {
obj.style[attr] = icur + iSpeed + 'px';
}
}
if (bStop) {
clearInterval(obj.timer);
if (fn) {
fn();
}
}
}, 30);
}
//获取样式内的属性
function getStyle(obj, attr) {
if (obj.currentStyle) {
return obj.currentStyle[attr];
} else {
return getComputedStyle(obj, false)[attr];
}
}
javascript 切换动画的更多相关文章
- jQuery Mobile 连接外部连接或切换动画
jQuery Mobile不同网页之间的跳转问题 jQuery Mobile,一个新的手机终端脚本开发库,从名字可以看出,它是基于jQuery:目前支持很多种手机设备,包括IOS/Android/Bl ...
- javascript帧动画
前面的话 帧动画就是在“连续的关键帧”中分解动画动作,也就是在时间轴的每帧上逐帧绘制不同的内容,使其连续播放而成的动画.由于是一帧一帧的画,所以帧动画具有非常大的灵活性,几乎可以表现任何想表现的内容. ...
- QtQuick多页面切换、多页面切换动画、多个qml文件数据交互
一.QtQuick多页面切换方法 (1)“隐藏法” 前一个视图visible设为false或者透明度opacity设为0,相当于“隐藏”了,实际还存在: 要显示的视图visible设为true或者透明 ...
- "Javascript高性能动画与页面渲染"笔记
前言:好久没翻阅我的gmail邮箱了,午休时就打开看了一下,看到InfoQ推荐的一篇名为“Javascript高性能动画与页面渲染”文章,粗略的看了一下,很赞!讲的很详细,对好些细节讲的都很好,很通俗 ...
- 深入理解requestAnimationFrame并实现相册组件中的切换动画
全手打原创,转载请标明出处:https://www.cnblogs.com/dreamsqin/p/12529885.html,多谢,=.=~ (如果对你有帮助的话请帮我点个赞啦) 通常情况下,我们利 ...
- Javascript - Vue - 动画
动画状态类名 vue动画通过将需要执行动画的标签放入transition标签中,再通过设置预置的vue动画类名的css样式来控制动画的呈现效果. 开场动画状态的三个类名 v-enter:动画开始之前的 ...
- uwp 图片切换动画
最近在学习安卓,LOL自定义战绩项目近乎停工,而且腾旭把界面全改了,好烦.刚好学习到安卓中的图片切换动画,我就想在LOL项目中实现一个.首先上百度查看一下,妈的,资料少的可怜. 还是自己来吧.自定义控 ...
- HTML5移动端图片左右切换动画
插件描述:HTML5移动端图片左右切换动画 小海今天要给大家分享一款很不错的图片左右切换焦点图动画,并且支持移动端触摸滑动.功能上,这款HTML5图片播放器支持鼠标滑动.手机端触摸滑动以及自动播放.外 ...
- Android Activity 切换动画(非原创)
在Android开发过程中,经常会碰到Activity之间的切换效果的问题,下面介绍一下如何实现左右滑动的切换效果,首先了解一下Activity切换的实现,从Android2.0开始在Activity ...
随机推荐
- tomcat免安装版注册为系统服务
环境: OS:windows7_64bit JDK:jdk1.6_64bit tomcat:apache-tomcat-7.0.61-windows-x64 1.修改tomcat/bin/servic ...
- Objective-C 字典、可变字典
字典相当于c++ stl中的map 字典NSDictionary #import <UIKit/UIKit.h> #import "AppDelegate.h" int ...
- About USB Data Link Cable API
About USB Data Link Cable API The text on this webpage is licensed under the Creative Commons Attrib ...
- vc 获取当前时间
1.使用CTime类 CString str; //获取系统时间 CTime tm; tm=CTime:: GetCurrentTime_r(); str=tm.Format("现在时间是% ...
- mysql 权限分配及创建新用户
前言 本文主要是介绍mysql创建新用户命令及赋予权限等命令,为了便于理解,文中会给出相关示例.通常情况下,创建用户,修改mysql密码,授权,是需要有mysql里的root权限. 1.创建用户: / ...
- mysql 超时 问题处理
当数据库出现10055和10048错误时,处理办法: 第一 链接超时设置(1)打开注册表:regedit 找到 HKEY_LOCAL_MACHINE\SYSTEM\CurrentControlSet\ ...
- 数据画图 jpgraph & chart.js
今天想到要研究下“用图表的形式来呈现数据”这个主题.对比了下两种实现的方法: 方法一:通过php代码在服务器端生成图像,再将图像传回客户端.使用jpGraph类库. 方法二:通过js和html5技术, ...
- JQuery中parents和closest的区别
jquery中查找上层元素一般都习惯了用parents方法,往往忽略了还有一个效率更高的closest方法,看下w3cschool的解释 过程不一样,closest是找到一个即停止,而parents将 ...
- python文件批量改名
python对文件进行批量改名用到的是os模块中的listdir方法和rename方法. os.listdir(dir) :获取指定目录下的所有子目录和文件名 os.rename(原文件名,新文件名 ...
- 如何实现SQL事务的提交,又不对外进行污染
一.以下是本人的一点思路: 1.在事务方法中,参数运用委托Func,选用Func 的原因是多入参,单一出参2.事务传参运用泛型,选用泛型的原因是可以减少代码量,类型安全 二.说明中涉及4个类:1.Or ...