博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
JS学习笔记 - 透明度运动框
阅读量:4322 次
发布时间:2019-06-06

本文共 1343 字,大约阅读时间需要 4 分钟。

 

该练习的笔记如下:

1.  var cur=0;  //先声明一个变量。

2.  parseInt会舍掉小数,而opacity值恰恰是小数,所以对于opacity,必须用parseFloat。

cur=parseFloat(getStyle(obj, attr))*100;

3.

a.  '+ var +' 字符串中引入变量的格式。

b. 透明度兼容性问题,需要2种分别赋值。

if(attr=='opacity')          {            obj.style.filter='alpha(opacity:'+(cur+speed)+')';             obj.style.opacity=(cur+speed)/100;           }

4.  Math.round(); 四舍五入,舍去小数。 可解决parseFloat之后数值有很多小数位的问题。

5. 运动函数中,opacity的目标值是100,不是1。 (可直接记成和css里的相反。)

startMove(this, 'opacity', 100);

    要根据后面的运用场景来看,这个值不是用来给式样赋值的。而是后面运动函数里使用的。 

 

疑点:

这里字符串变量连接没有括号? 需要搞清楚、熟记字符串连接规则的部分。

obj.style[attr]=cur+speed+'px';

 

  
无标题文档
cur=Math.round(parseFloat(getStyle(obj, attr))*100);  // Math.round();  四舍五入,舍去小数。
}        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)+')'; // '+ var +'  字符串中引入变量的格式。            obj.style.opacity=(cur+speed)/100;   //透明度兼容性问题需要2种分别赋值。          }          else          {            obj.style[attr]=cur+speed+'px'; //这里的字符串连接方式?          }        }      }, 30);    }  

 

转载于:https://www.cnblogs.com/carpenterzoe/p/10179077.html

你可能感兴趣的文章
c# 字段、属性get set
查看>>
td内容超出隐藏
查看>>
Spring CommonsMultipartResolver 上传文件
查看>>
Settings app简单学习记录
查看>>
SQLAlchemy
查看>>
多线程
查看>>
使用缓存的9大误区(下)转载
查看>>
appium键值对的应用
查看>>
MyEclipse 8.X 通用算法
查看>>
selenium.Phantomjs设置浏览器请求头
查看>>
分布式数据库如何选择,几种分布式数据库优缺点一览
查看>>
BZOJ 4443: 小凸玩矩阵【二分图】
查看>>
苹果 OS X制作u盘启动盘
查看>>
Jquery便利对象
查看>>
MVC: Connection String
查看>>
idea常用设置汇总
查看>>
Node.SelectNodes
查看>>
Lambda表达式语法进一步巩固
查看>>
Vue基础安装(精华)
查看>>
Git 提交修改内容和查看被修改的内容
查看>>