function getStyle(obj, name) {
if (obj.currentStyle) {
return obj.currentStyle[name];
}
else {
return getComputedStyle(obj, false)[name];
}
} function startMove(obj, attr, iTarget) {
clearInterval(obj.timer);
obj.timer = setInterval(function () {
var cur = 0; //parseInt(getStyle(obj, attr));
if (attr == 'opacity') {
cur = Math.round(parseFloat(getStyle(obj, attr)) * 100);
}
else {
cur = parseInt(getStyle(obj, attr));
} var speed = (iTarget - cur) / 6;
speed = speed > 0 ? Math.ceil(speed) : Math.floor(speed); if (cur == iTarget) {
clearInterval(obj.timer);
}
else {
if (attr == 'opacity') {
obj.style.filter = 'alpha(opacity:' + (cur + speed) + ')';//IE使用
obj.style.opacity = (cur + speed) / 100;//chrome和FF使用
}
else {
obj.style[attr] = cur + speed + 'px';
}
}
}, 30);
}

任意值运动框架Move模块 js的更多相关文章

  1. 无限循环轮播图之运动框架(原生JS)

    封装运动框架 function getStyle(obj,name){ if(obj.currentStyle){ return obj.currentStyle[name]; }else{ retu ...

  2. JS之链式运动,及任意值运动框架,包括透明度的改变

    链式运动,顾名思义,一环扣一环,即执行完一个事件后,再接着执行下一个事件,在参数上面动手脚,将下一个要执行的函数名作为一个参数,即利用到回掉函数,下面代码中出现的fn,即回掉函数, function ...

  3. JS 之完美运动框架

    完美运动框架是对原来的任意值运动框架的改善和效率的提升,即利用了json对属性进行封装,从而提高效率: window.onload=function(){ var oDiv=document.getE ...

  4. JavaScript的运动框架学习总结

    一.目录 1. 入门案例——实现匀速运动 2. 入门案例——实现缓冲运动 3. 实现任意值的运动框架v.1 4. 改进任意值的运动框架v.2 5. 改进任意值的运动框架v.3 6. 实现链式运动框架 ...

  5. JS运动学习笔记 -- 任意值的运动框架(高/宽度,背景颜色,文本内容,透明度等)

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. js运动框架逐渐递进版

    运动,其实就是在一段时间内改变left.right.width.height.opactiy的值,到达目的地之后停止. 现在按照以下步骤来进行我们的运动框架的封装: 匀速运动. 缓冲运动. 多物体运动 ...

  7. 带无缝滚动的轮播图(含JS运动框架)

    今天学习了一下轮播图的写作,想到前一阵学过的无缝滚动得思想,所以就把轮播与滚动结合了一下.不过我的代码的神逻辑我自己都不敢恭维,在没网没参照的情况下,只能硬着头皮往下写,希望跟大家共勉吧. js运动框 ...

  8. js运动框架之一条乱跑的虫子

    克隆与运动框架的联合应用 效果:点击元素块后,元素块开始随机的向任何方向移动,并附带一堆颜色随机的"尾巴".每个方向运动3秒后改变方向,同时笑脸变哭脸. 如图所示: 朝某个方向运动 ...

  9. JS完美运动框架

    这套框架实现了多物体,任意值,链式运动,多值运动,基本满足常见的需求. /* 功能:完美运动框架,可以实现多物体,任意值,链式运动,多值运动 版本:V1.0 兼容性:Chrome,FF,IE8+ (o ...

随机推荐

  1. 【Python】【爬虫】爬取酷狗TOP500

    好啦好啦,那我们来拉开我们的爬虫之旅吧~~~ 这一只小爬虫是爬取酷狗TOP500的,使用的爬取手法简单粗暴,目的是帮大家初步窥探爬虫长啥样,后期会慢慢变得健壮起来的. 环境配置 在此之前需要下载一个谷 ...

  2. 每天进步一点点------下载Microblaze程序到Flash

    第一步 生成下载文件(bit文件) 选择之前的工作目录,打开SDK.点击Program FPGA图标. 将bootloop项改为Hello_World.elf.点击Program.此时可以不用连接下载 ...

  3. Java代码如何关联Hadoop源码

    昨天在学习Hadoop的时候,遇到一个问题就是Java关联Hadoop源码的时候死活关联不上,但是我发现在公司的电脑就可以顺利关联到源码.考虑了一下觉得应该是Eclipse版本的问题,于是我下载了ec ...

  4. Hadoop2.0之YARN组件

    官方文档:https://hadoop.apache.org/docs/stable/,目前官方已经是3.x,但yarn机制没有太大变化 一.简介 在Hadoop1.0中,没有yarn,所有的任务调度 ...

  5. element-ui里el-form的lable颜色怎么修改?

    就是把style改写成全局的,不要scoped(注意class,id的唯一,不要影响了整体布局) 链接:https://segmentfault.com/q/1010000017251094

  6. JAXB "有两个名为 "**" 的属性,类的两个属性具有相同名称 "**""解决方案

    这里说的名称冲突指的是: JavaBean 属性名称与字段名称之间的名称冲突.在pojo类中的setter和getter方法会导致运行报错:Exception in thread "main ...

  7. Springboot的多环境配置

    通常应用都会被安装到几个不同的环境(比如开发.测试.生产等),每个环境都会有一些参数是不一样的. Spring Boot对此也提供了支持,配置文件的名称只要满足application-{profile ...

  8. Spring - 周边设施 - H2 embedded 版本引入

    1. 概述 在 Spring 开发中, 引入 H2 做辅助测试数据库 2. 场景 复习 Spring, 复习到 持久化 部分 需要一个 数据库 来做测试 方案 方案1: 搭建 MySQL 实例 虽然现 ...

  9. 每天进步一点点------SOPC的Avalon-MM IP核(二) AVALON总线的IP核定制

    简介 NIOS II是一个建立在FPGA上的嵌入式软核处理器,除了可以根据需要任意添加已经提供的外设外,用户还可以通过定制用户逻辑外设和定制用户指令来实现各种应用要求.这节我们就来研究如何定制基于Av ...

  10. 每天进步一点点------入门视频采集与处理(显示YUV数据)

    做视频采集与处理,自然少不了要学会分析YUV数据.因为从采集的角度来说,一般的视频采集芯片输出的码流一般都是YUV数据流的形式,而从视频处理(例如H.264.MPEG视频编解码)的角度来说,也是在原始 ...