js动画--一个小bug处理下
对于上面的课程我们很好的处理了一个小bug,那么我们现在讲程序进行优化一下,前一节的程序中,我们处理处理的属性都是写死了的。为了我们能够很好的对某个属性进行操作的话。我们这样来设置。
js文件
window.onload=function(){
var ls=document.getElementsByTagName("li");
for(var i=0,l=ls.length;i<l;i++){
ls[i].timer=null;
ls[i].onmouseover=function(){
startMove(this,"width",400);
}
ls[i].onmouseout=function(){
startMove(this,"height",400);
}
}
}
function startMove(object,attr,Target){
//alert(parseInt(getStyle(object,attr));
clearInterval(object.timer);
object.timer=setInterval(function(){
var speed=(Target-parseInt(getStyle(object,attr)))/10;
speed=speed>0? Math.ceil(speed):Math.floor(speed);
if(parseInt(getStyle(object,attr))==Target){
clearInterval(object.timer);
}else{
object.style[attr]=parseInt(getStyle(object,attr))+speed+"px";//这个地方,我们设置属性通过object.style[attr]来设置的。
}
},50)
}
function getStyle(object,attr){
if(object.currentStyle){
return object.currentStyle[attr];//IE浏览器
}else if(getComputedStyle){
return getComputedStyle(object,false)[attr];//火狐浏览器
}
}
js动画--一个小bug处理下的更多相关文章
- js动画---一个小bug的处理
对于前面的课程,大家似乎看不出来存在什么问题,一切都很顺利,但是其实是存在一个很大的bug的,这个bug是什么呢?? 我们来看看下面这个程序就知道了 <!DOCTYPE html> < ...
- 从一个小Bug,到Azure DevOps
1. 一个小Bug 最近和同事提起一个几年前的 Bug,那是一个很小很小的 Bug,没什么技术含量.那时候我刚入职,正好公司卖了一款仪器到某个国家,但是那边说配套的软件运行不起来,一打开就报错.经过排 ...
- 关于一个小bug的修正
python初学者,非常喜欢虫师的文章. 练习时发现一个小bug,http://www.cnblogs.com/fnng/p/3782515.html 验证邮箱格式一题中,第三个x不允许有数字,但是测 ...
- iOS开发之使用UICollectionView实现美团App的分类功能【偶现大众点评App的一个小bug】
郝萌主倾心贡献,尊重作者的劳动成果,请勿转载. 假设文章对您有所帮助,欢迎给作者捐赠,支持郝萌主,捐赠数额任意,重在心意^_^ 我要捐赠: 点击捐赠 Cocos2d-X源代码下载:点我传送 游戏官方下 ...
- js实现一个小游戏(飞翔的jj)
js实现一个小游戏(飞翔的jj) 源代码+素材图片在我的仓库 <!DOCTYPE html> <html lang="en"> <head> & ...
- Python2 下 Unicode 的一个小bug
关于Python的编码问题已经是老生常谈了,此处主要是介绍一个罕见的问题,也算是Python2的一个bug了(Python3不会有此问题). 在有时候我们去爬取网页或者调用一些第三方库获取文本的时候, ...
- 从CR线下活动学到的:如何组织一个小的线下活动
作者:朱克锋 邮箱:zhukefeng@iboxpay.com 转载请注明出处:http://blog.csdn.net/linux_zkf 周末在腾讯组织了GR,活动达到了预期的收获,从这次活动我主 ...
- VS2010环境下.NET4.0中Tuple<T>的一个小BUG问题
启动一个桌面程序后,发现一个窗体cfdata=null, 执行时发生错误, 但是在初始化的时候,我明明是cfdata=new Cfdata();为什么会出现这个错误呢. 我开始跟踪,发现当执行cfda ...
- 《Node入门》读书笔记——用Node.js开发一个小应用
Android APP的开发告一段落,一个稳定的.实现了基本功能的APP已经交付用户使用了!我和老板交流了下,接下来准备转战Node.js了,而且一部分前端的功能也要做进去!哈哈哈~~~接下来要朝一个 ...
随机推荐
- Qt相关博客总览
一.Qt快速入门 Qt快速入门之一:开始学习Qt 与Qt Creator Qt快速入门之二:Qt Creator简介 Qt快速入门之三:Qt程序编译和源码详解 Qt对话框之一:标准对话框 二.Qt窗口 ...
- [JS]截取字符,中英文都可以
//截取字符,中英文都可以,hasDot=true 返回值的最后还可以添加3个点 function subString(str, len, hasDot) { var newLength = 0; v ...
- angular数据请求 token验证
angualr的token 验证会经常用在登录,注册等地方 对于token的使用方法按照以下步骤进行使用即可 1.新建一个服务 ng g service services /+服务名 eg:ng g ...
- python 基础 ---- 面向对象
------ 面向对象的思想 三个基本特征: 封装(封装属性方法可以减少耦合)继承(可以抬高开发效率) 多态 主要包括 : 类 : 描述具有相同的属性和方法的对象的集合 变量: 类变量/ 成 ...
- Feign实现自定义错误处理
关键操作 实现ErrorDecoder接口 问题和背景 最近项目中在大量使用Feign和OkHttp作为http客户端使用,开发效率得到显著的提升.但也面临一些问题,比如每个下游系统的异常返回方式不同 ...
- php redis扩展安装步骤
因为redis不是php技术自带的技术,因此我们如果要通过php程序来操作redis,需要redis设计者提供对应的操作接口(函数类)我们使用phpredis.tar.gz文件在源码编译生成一个red ...
- Flutter 宽高比(比率)控件 AspectRatio
const AspectRatio({ Key key, @required this.aspectRatio, Widget child,}) void main() { runApp( n ...
- teacher笔记
======= 总览 start ======= 1.素质教育以提高国民素质为根本宗旨4.素质教育是促进学生个性发展的教育5.素质教育是以培养学生的创新精神和事件能力为重点的教育2.素质教育是面向全体 ...
- 「雅礼集训 2017 Day1」字符串 SAM、根号分治
LOJ 注意到\(qk \leq 10^5\),我们很不自然地考虑根号分治: 当\(k > \sqrt{10^5}\),此时\(q\)比较小,与\(qm\)相关的算法比较适合.对串\(s\)建S ...
- 测试欧气的小游戏-java
Java 用我们学到的知识做处一个小的项目或者游戏等等应该都或多或少的有一点点的成就感吧,下列就是我用所学的基础知识做的猜字谜游戏,并且给他赋予了灵魂哈哈哈.有兴趣的可以尝试的用自己会的知识做一些小的 ...