为了账号安全,请及时绑定邮箱和手机立即绑定

JS动画效果

vivian Web前端工程师
难度初级
时长 2小时 8分
学习人数
综合评分9.60
537人评价 查看评价
9.8 内容实用
9.6 简洁易懂
9.4 逻辑清晰
  • 【鼠标移出】 oDiv.onmouseout = function(){ startMove2(); } var timer = null; function startMove2(){ clearInterval(timer); var oDiv = document.getElementById("div1"); timer = setInterval(function(){ if(oDiv.offsetLeft==-200){ 前面的目标值是0,这里的目标值是-200 clearInterval(timer); }else{ oDiv.style.left = oDiv.offsetLeft-10+"px"; 前面是从左到右,这里是从右到左 } },30) }
    查看全部
    0 采集 收起 来源:JS速度动画

    2018-03-22

  • 【小知识点】 1、想让物体停下来,用if(oDiv.offsetLeft==0){ clearInterval(timer); } 2、每次开启新的定时器之前,先把以前的定时器关掉。否则的话,如果同时开了10个定时器那么速度就变成了原来的10倍。【所有定时器问题都这样】
    查看全部
    0 采集 收起 来源:JS速度动画

    2016-10-08

  • 【鼠标移入】 <script> window.onload = function(){ var oDiv = document.getElementById("div1"); oDiv.onmouseover = function(){ startMove(); } } var timer = null; function startMove(){ clearInterval(timer); var oDiv = document.getElementById("div1"); timer = setInterval(function(){ if(oDiv.offsetLeft==0){ clearInterval(timer); }else{ oDiv.style.left = oDiv.offsetLeft+10+"px"; } },30) } </script>
    查看全部
    0 采集 收起 来源:JS速度动画

    2018-03-22

  • 运动框架实现思路 1、速度(改变值left、right、width、height、opacity透明度) 2、缓冲运动 3、多物体运动 4、任意值变化 5、链式运动 6、同时运动
    查看全部
  • 运动.
    查看全部
  • 首先css样式表有三种样式, 一、内联样式 在HTML标签用style属性设置,如 : <p >这是内联样式</p> 二、嵌入样式 通过<head>标签内通过<style>标签设置。如: <style type="text/css"> /*这是嵌入样式*/ .stuff{color:#f90} </style> 三、外部样式 通过<link>标签设置。如: <link rel="stylesheet" href="path/style.css" type="text/css"> 而在javascript中,获取这三种样式表的方法是有限制的,style只能获取元素的内联样式, 嵌入样式和外部样式使用style是获取不到的,javascript提供了另外的获取方式,嵌入样式和外部样式可以通过currentStyle(IE浏览器)、getComputedStyle(Firefox、opera、safari、chrome浏览器)的方式获取。 使用方法分别是window.currentStyle["attr']和window.getComputedStyle(ob, pseudoElt)["attr']。
    查看全部
    1 采集 收起 来源:获取样式

    2018-03-22

  • 运动!
    查看全部
    0 采集 收起 来源:JS动画案例

    2016-10-07

  • json简单的说就是JavaScript中的对象和数组,所以这两种结构就是对象和数组的结构,通过这两种结构可以表示各种复杂的结构
    查看全部
  • JQuery实现动画案例:
    查看全部
    0 采集 收起 来源:jQuery动画案例

    2016-10-03

  • JS动画案例:
    查看全部
    0 采集 收起 来源:JS动画案例

    2016-10-03

  • json中值以键值对存在 如 var json={key:value,key:value}; 通过foreach遍历json中的值 for(var i in json){ alert(i);//输出key alert(json[i]);//输出value } 使用JSON处理同时给元素添加效果,直接传json对象给函数,foreach遍历json,开启定时器实现效果,当所有效果都实现了在停止定时器
    查看全部
  • 同时执行两个定时器函数,后一个函数执行时会清除前一个函数的定时器, 所以实际效果是只执行后一个函数
    查看全部
    0 采集 收起 来源:同时运动

    2016-10-03

  • 链式运动,按顺序添加效果,在按顺序去除效果;如添加1-》2-》3,去除3-》2-》1
    查看全部
    0 采集 收起 来源:JS链式动画

    2016-10-03

  • 宽度设行了,为什么width 就变了
    查看全部
    0 采集 收起 来源:获取样式

    2016-10-03

  • parseFloat将数字字符串转化为浮点数 浏览器对小数支持不精确 如:0.07*100输出的则为7.00000000000001; Math.round()函数,四舍五入取整;
    查看全部

举报

0/150
提交
取消
课程须知
1.您至少已经具备JavaSript的知识。2.您已经具备一些开发经验。
老师告诉你能学到什么?
1.使用定时器实现简单动画。2.如何一步步封装库。2.培养编程的思想。

微信扫码,参与3人拼团

意见反馈 帮助中心 APP下载
官方微信
友情提示:

您好,此课程属于迁移课程,您已购买该课程,无需重复购买,感谢您对慕课网的支持!