摘要:
touchstart、touchmove、touchend三个事件都会各自有事件对象。 TouchEvent是一类描述手指在触摸平面(触摸屏、触摸板等)的状态变化的事件。这类事件用于描述一个或多个触点,使开发者可以检测触点的移动,触点的增加和减少,等等 示例代码: <!DOCTYPE html> < 阅读全文
posted @ 2022-04-14 22:13
今天穿秋裤了吗
阅读(111)
评论(0)
推荐(0)
摘要:
触屏事件概述: 移动端浏览器兼容性较好,我们不需要考虑以前JS的兼容性问题,可以放心的使用原生JS书写效果,但是移动端也有自己独特的地方。比如触屏事件touch (也称触摸事件),Android和IOS都有心 代码示例: <!DOCTYPE html> <html lang="en"> <head> 阅读全文
posted @ 2022-04-14 21:59
今天穿秋裤了吗
阅读(26)
评论(0)
推荐(0)
摘要:
缓动动画就是让元紊运动速度有所变化,最常见的是让速度慢慢停下来 让盒子每次移动的距离慢慢变小,速度就会慢慢落下来。 核心算法:(目标值-现在的位置)/10做为每次移动的距离步长 停止的条件是:让当前盒子位置等于目标位置就停止定时器 基本代码实现: <!DOCTYPE html> <html lang 阅读全文
posted @ 2022-04-14 14:01
今天穿秋裤了吗
阅读(79)
评论(0)
推荐(0)
摘要:
如果多个元素都使用这个动画函数,每次都要var声明定时器。我们可以给不同的元素使用不同的定时器(自己专门用自己的定时器)。核心原理:利用Js是一门动态语言,可以很方便的给当前对象添加属性。 示例代码: <!DOCTYPE html> <html lang="en"> <head> <meta cha 阅读全文
posted @ 2022-04-14 13:30
今天穿秋裤了吗
阅读(48)
评论(0)
推荐(0)
摘要:
注意函数需要传递2个参数,动画对象和移动到的距离。 示例: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <me 阅读全文
posted @ 2022-04-14 13:10
今天穿秋裤了吗
阅读(37)
评论(0)
推荐(0)
摘要:
核心原理:通过定时器setlnterval0不断移动盒子位置。 实现步骤: 1.获取盒子当前位置 2.让盒子在当前位置加上1个移动距离 3.利用定时器不断重复这个操作 4.加一个结束定时器的条件 5.注意此元素需要添加定位,才能使用element.style.left 代码示例: <!DOCTYPE 阅读全文
posted @ 2022-04-14 12:46
今天穿秋裤了吗
阅读(94)
评论(0)
推荐(0)
摘要:
当鼠标移动到元素上时就会触发mouseenter事件 类似 mouseover,它们两者之间的差别是 mouseover鼠标经过自身盒子会触发,经过子盒子还会触发。mouseenter只会经过自身盒子触发 之所以这样,就是因为mouseenter不会冒泡 阅读全文
posted @ 2022-04-14 11:46
今天穿秋裤了吗
阅读(45)
评论(0)
推荐(0)