zoukankan      html  css  js  c++  java
  • JS StartMove源码-简单运动框架

    这几天学习js运动应用课程时,开始接触一个小例子:“仿Flash的图片轮换播放器”,其中使用的StartMove简单运动框架我觉得挺好用的。这个源码也简单,理解其原理,自己敲即便也就熟悉了。

    用的时候,将下列代码放在一个js文件,如move.js。然后使用的时候引入该文件。如<script src="move.js"></script>

    function getStyle(obj,name){     //获取对象的样式
        if(obj.currentStyle){        //考虑浏览器问题,采用if判断获取当前对象的样式
            return obj.currentStyle[name];
            }else{
            return getComputedStyle(obj,false)[name];
            }
        }
        
    function startMove(obj,attr,Target){
        clearInterval(obj.timer);
        obj.timer = setInterval(function(){
            var cur = 0;
            
            if(attr=='opacity')
            {
            //像素本身是小数类型的,所以用Math.round取整,这里乘100,下面使用这个参数的时候会进行除100.
            cur = Math.round(parseFloat(getStyle(obj,attr))*100);
            }
            else
            {
            cur = parseInt(getStyle(obj,attr));
            }
            var spped = (Target-cur)/6;
            speed = speed>0?Math.ceil(speed):Math.floor(speed);
            if(Target==cur)
            {
            clearInterval(obj.timer);
            }
            else
            {
            //因为obj.style[attr]=cur+speed+'px';语句不适用opacity,所以要判断
            if(attr=='opacity')  
            {
                obj.style.filter='alpha(opacity:'+(cur+speed)+')'; //IE兼容
                obj.style.opacity=(cur+speed)/100;  //火狐兼容
            }
            else
            {
            obj.style[attr]=cur+speed+'px';    
            }
            }
            },30
        
        );
    
        }
  • 相关阅读:
    SqlSugar的基本使用
    File文件操作类
    FTP文件操作类
    ASP.NET WebApi使用Swagger做接口文档
    asp.net中WebService 捕获全局异常
    net log4net 通用配置
    jQuery插件开发模式(转)
    js 对Cookie进行增删改操作
    使用JQ实现相同行或列合并
    sql 取得某个时间段内的所有月份和日期
  • 原文地址:https://www.cnblogs.com/yswyzh/p/9798095.html
Copyright © 2011-2022 走看看