move.js
function startMove(obj,json,fn){
var flag=true;//标志所有运动是否到达目标值
clearInterval(obj.timer);
obj.timer=setInterval(function(){
for(var attr in json){
var curr=0;
//判断是否为透明度
if(attr=='opacity'){
curr=Math.round(parseFloat(getStyle(obj,attr))*100);
}else{
curr=parseInt(getStyle(obj,attr));
}
//移动速度处理
var speed=0;
speed=(json[attr]-curr)/10;
speed=speed>0?Math.ceil(speed):Math.floor(speed);
if(curr!=json[attr]){
flag=false;
}
if (attr=='opacity') {
obj.style.filter='alpha(opacity:'+(curr+speed)+")";
obj.style.opacity=(curr+speed)/100;
}else{
obj.style[attr]=curr+speed+'px';
}
}
if(flag){
clearInterval(obj.timer);
if(fn){
fu();
}
}
},30);
}
//取样式
function getStyle(obj,attr){
if(obj.currentStyle){//IE取样式
return obj.currentStyle[attr];
}else{
return getComputedStyle(obj,false)[attr];
}
}
move.js的更多相关文章
- move.js 源码 学习笔记
源码笔记: /* move.js * @author:flfwzgl https://github.com/flfwzgl * @copyright: MIT license * Sorrow.X - ...
- 【干货】教你如何利用fullPage.js以及move.js插件打造高端大气的网站效果!
前言: 如今我们经常能见到全屏网站,尤其是国外网站.这些网站用几幅很大的图片或色块做背景,再添加一些简单的内容,显得格外的高端大气上档次. 在学习过jQuery插件之后,才发现之前的很多网站特效完全可 ...
- move.js运动插件
move.js 运动插件是一款针对元素动画效果的插件.可以运用此插件制作出各类元素效果. 插件GitHub地址:https://github.com/visionmedia/move.js 下面整理学 ...
- 百叶窗特效(用move.js库)
每逢佳节胖三斤啊,胖了胖了,加上每天坐在电脑前,现在还和一个智障聊天,后天去苏州玩的事情,住哪里啊?去哪里嘿嘿嘿啊? 苏州,找了下,攻略,听说一定要去园林看,听说很牛逼,好吧,陶冶一下我的情操.今天操 ...
- 基础运动move.js
/* * 事件绑定 */ function myAddEvent(obj,ev,fn){ if(obj.attachEvent){ obj.attachEvent('on' + ev,fn); }el ...
- [转载]fullPage.js中文api 配置参数~
fullPage.js中文api 配置参数 选项 类型 默认值 说明 verticalCentered 字符串 true 内容是否垂直居中 resize 布尔值 false 字体是否随着窗口缩放而缩放 ...
- fullPage.js学习笔记
中秋节,一个人呆着,挺无聊的,还是学习最有趣,不论是什么,开阔视野都是好的. 参考网址:http://www.dowebok.com/77.html 上面有详细介绍及案例展示,很不错哦,可以先去看看 ...
- 不可错过的炒鸡棒的js迷你库
小而美被实践是最好用的,这里收藏了一些很好用的js库,他们都功能单一且非常小. COOKIE.JS https://github.com/js-coder/cookie.js 如果你操作过cooki ...
- js手风琴
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8&qu ...
随机推荐
- Android Every day a new function:one
扁平化按钮" 效果图: 代码: <?xml version="1.0" encoding="utf-8"?> <selector x ...
- J2SE知识点摘记(十七)
1. Applet Applet的生命周期分为四个阶段,各阶段分别由init,start,stop和destroy四种方法来具体体现. public void init() 此方法通知A ...
- Umbraco模型默认属性
Media Model的属性: umbracoFileumbracoWidthumbracoHeightumbracoBytesumbracoExtension
- IC卡存储器介绍
自从80年代中期出现IC电话卡后,基本已取代了原来流行的电话磁卡,磁卡存在存在严重的安全问题,已逐步淘汰.即使IC电话卡,也不能算很安全,卡内所有数据只要有简单的读写装置并按时序操作都能读取,事实上电 ...
- python手记(36)
#!/usr/bin/env python #-*- coding: utf-8 -*- #code:myhaspl@qq.com import cv2 import numpy as np fn=& ...
- 30款基本UX工具 - 用户测试与反馈工具
日期:2013-9-5 来源:GBin1.com 在上一篇30款基本UX工具 - 思维流程工具 & 原型工具中,我们提到了10款用于头脑风暴和原型创建的工具,用于帮助我们在用户体验上可以做的 ...
- 教你爱上Blocks(闭包)
传值 Blocks是C语言的扩充功能:带有自动变量(局部变量)的匿名函数.通过Blocks,源代码中就能使用匿名函数,即不带名称的函数.在我们 的工作中,命名占据了很大一部分,函数名,变量名,属性名, ...
- 深度学习工具caffe具体安装指南
caffe安装指南-吐血整理 前言: 在一台系统环境较好的linux机器上能够非常easy的安装caffe,可是假设系统本身非常旧,又没有GPU的话.安装就太麻烦了,全部都得从头做起,本文档旨在尽可能 ...
- Javascript基础篇小结
转载请声明出处 博客原文 随手翻阅以前的学习笔记,顺便整理一下放在这里,方便自己复习,也希望你有也有帮助吧 第一课时 入门基础 知识点: 操作系统就是个应用程序 只要是应用程序都要占用物理内存 浏览器 ...
- SQL学习之用通配符进行数据过滤
一.Like操作符 之前介绍的所有的操作符都是针对已知值进行过滤.不管匹配一个值还是多个值,检验大于还是小于已知值,或者检查某个范围的值,其共同点是过滤中使用的值都是已知的. 但是这种方法并不是任何时 ...