這三個函式都是
數學函式
math
math.ceil()向上取整天花板
比如說 console.log(math.ceil(1.01)) 結果 是
2
console.log(math.ceil(1.9)) 結果 2
console.log(math.ceil(-1.3)) 結果 是
-1
math.floor()向下取整地板
比如說 console.log(math.floor(1.01)) 結果 是
1
console.log(math.floor(1.9)) 結果 1
console.log(math.floor(-1.3)) 結果 是
-2
math.round()四捨五入函式
console.log(math.round(1.01)) 結果 是 1
console.log(math.round(1.9)) 結果 是
2 勻速動畫的原理：
盒子本身的位置 + 步長
緩動動畫的原理: 盒子本身的位置
+ 步長
(不斷變化的)
三、緩動動畫封裝函式如下：
1doctype html
>
2<
html
>
3<
head
lang
="en"
>
4<
meta
charset
="utf-8"
>
5<
title
>
title
>
6<
style
>
7div
15style
>
16head
>
17<
body
>
18<
button
id="btn200"
>200
button
>
19<
button
id="btn400"
>400
button
>
20<
div
id="box"
>
div>
21body
>
22html
>
23<
script
>
24var
btn200
=document.getelementbyid(
"btn200");
25var
btn400
=document.getelementbyid(
"btn400");
26var
box
=document.getelementbyid(
"box");
27btn200.onclick
=function
() 30
btn400.onclick
=function
() 33
34function
animate(obj,target)
45},30)
46}47
script
>
js off 緩動動畫
動畫也有很多種，一起來學習，緩動動畫吧 緩動動畫 1 緩動動畫原理 盒子位置 目標盒子位置 現在盒子位置 10 2 步長越來越小 3 讓步長越來越小的公式 步長 目標位置 本身位置 10 var but document.getelementsbytagname button 0 var box d...
JS緩動動畫原理
class btn300 小劉300button class btn800 小劉800button 小劉div 勻速動畫 就是 盒子當前的offsetleft 固定值 緩動動畫 就是 盒子當前的offsetleft 變化的值 目標值 現在的位置 10 注意步長向上取整 緩動動畫原理 就是讓元素的運動...
封裝緩動動畫3
前面兩篇都是做了一些關於緩動動畫的基礎，現在，可以在前面的基礎上真正的封裝緩動動畫了。btn onclick function 20 首先確定需要改變的屬性，並獲取初始值 function getcssattrvalue obj,attr else其次要根據style attr 動態改變該元素的值，...