封装动画

function animate(obj,target){    if(obj.timer){        clearInterval(obj.timer);//保证每次只有一个定时器在执行    }     obj.timer=setInterval(function(){//设置一个自定义属性，不要加var        //先找到当前位置        var leader=obj.offsetLeft;        //设定步长        var step=9;        if(target<leader){//判断步长            step=-step;        }        var instance=Math.abs(target-leader);//当差大于一个步长才会去执行        if(instance>Math.abs(step)){            leader=leader+step;            obj.style.left=leader+"px";//加单位        }else{            clearInterval(obj.timer);            obj.style.left=target+"px";//当小于一个步长时，就直接拿过去        }

},15)}
时间： 2024-08-28 08:53:16

封装动画的相关文章

iOS开发UI篇—核心动画(UIView封装动画)

一.UIView动画(首尾) 1.简单说明 UIKit直接将动画集成到UIView类中,当内部的一些属性发生改变时,UIView将为这些改变提供动画支持 执行动画所需要的工作由UIView类自动完成,但仍要在希望执行动画时通知视图,为此需要将改变属性的代码放在[UIView beginAnimations:nil context:nil]和[UIView commitAnimations]之间 常见方法解析: + (void)setAnimationDelegate:(id)delegate  

ios uiview封装动画(摘录)

iOS开发UI篇—核心动画(UIView封装动画) 一.UIView动画(首尾) 1.简单说明 UIKit直接将动画集成到UIView类中,当内部的一些属性发生改变时,UIView将为这些改变提供动画支持 执行动画所需要的工作由UIView类自动完成,但仍要在希望执行动画时通知视图,为此需要将改变属性的代码放在[UIView beginAnimations:nil context:nil]和[UIView commitAnimations]之间 常见方法解析: + (void)setAnimat

核心动画(UIView封装动画)

一.UIView动画(首尾) 1.简单说明 UIKit直接将动画集成到UIView类中,当内部的一些属性发生改变时,UIView将为这些改变提供动画支持 执行动画所需要的工作由UIView类自动完成,但仍要在希望执行动画时通知视图,为此需要将改变属性的代码放在[UIView beginAnimations:nil context:nil]和[UIView commitAnimations]之间 常见方法解析: + (void)setAnimationDelegate:(id)delegate  

iOS开发UI篇—核心动画(UIView封装动画)（转摘）

iOS开发UI篇—核心动画(UIView封装动画) 一.UIView动画(首尾) 1.简单说明 UIKit直接将动画集成到UIView类中,当内部的一些属性发生改变时,UIView将为这些改变提供动画支持 执行动画所需要的工作由UIView类自动完成,但仍要在希望执行动画时通知视图,为此需要将改变属性的代码放在[UIViewbeginAnimations:nil context:nil]和[UIView commitAnimations]之间 常见方法解析: + (void)setAnimati

通过轮播图例子复习封装动画函数和定时器

概述:使用js实现自动播放.无缝连接的轮播图 图片轮播的实质是改变图片相对于父对象的左边距的值,利用offsetLeft获取,利用style.left修改 封装动画函数如下: function animate(element,target) { clearInterval(element.timeId); element.timeId=setInterval(function(){ var current=element.offsetLeft; var step=10; step=target>

08第二种定时器_封装动画函数_轮播图_offset系列

前面复习: 下面会说第二种定时器. 第二种定时器: 第一种的定时器回顾: 另一个定时器 setTimeout() 它是一个一次性的定时器: 因为,代码是从上往下执行的,btn 还没有生成,所以getElementById("btn").onclick = 肯定是会报错的. 它是一次性的定时器,如果没有取消的话,它会一直占着空间,所以一般都要写按钮btn 去取消timeId  . 1 <!DOCTYPE> 2 <html lang="en">

封装动画的函数

// var timerId = null;// 封装动画的函数function animate(element, target) { // 通过判断,保证页面上只有一个定时器在执行动画 if (element.timerId) { clearInterval(element.timerId); element.timerId = null; } element.timerId = setInterval(function () { // 步进 每次移动的距离 var step = 10; //

ios UIView封装动画

1 #import "NJViewController.h" 2 3 @interface NJViewController () 4 @property (weak, nonatomic) IBOutlet UIView *cutomView; 5 6 @end 7 8 @implementation NJViewController 9 10 - (void)viewDidLoad 11 { 12 [super viewDidLoad]; 13 14 } 15 - (void)to

JavaScript封装动画函数

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title></title> <style> * { margin: 0; padding: 0; } div { margin-top: 10px; width: 100px; height: 50px; background-color: purple;