鼠标跟随特效的实现方法、装置、计算机设备及存储介质制造方法及图纸

本发明专利技术公开了一种鼠标跟随特效的实现方法、装置、计算机设备及存储介质，应用于计算机技术领域，用于在web网页端实现鼠标的线性特效。本发明专利技术提供的方法包括：监听到鼠标操作事件时，获取鼠标在浏览器页面中操作的坐标点；将获取的该坐标点按照事件发生的时间先后顺序依次存储在数组中；实时获取鼠标在该浏览器页面经过的坐标点，将该坐标点更新存储在数组中；将该数组中存储的两相邻坐标点依次连接成线段，以形成该鼠标的运动轨迹，并将该运动轨迹在预先创建的画布中显示；在该浏览器每渲染一次页面帧时，擦除该画布中显示的该运动轨迹，获取该数组中最近一次更新的该鼠标的坐标点，循环形成该鼠标的运动轨迹至本步骤直至所述鼠标操作事件停止。

【技术实现步骤摘要】
鼠标跟随特效的实现方法、装置、计算机设备及存储介质
本专利技术涉及计算机
，尤其涉及鼠标跟随特效的实现方法、装置、计算机设备及存储介质。
技术介绍
鼠标或手指的跟随特效是现在H5游戏中比较重要的游戏反馈，鼠标跟随特效的意思是当鼠标或手指在页面中滑过时，会产生一道跟随鼠标滑动痕迹的跟随轨迹。我们以往能看到这种跟随效果只能在某些游戏APP上，基于Web端与终端的程序开发环境不同，现今世面上在Web端要实现鼠标跟随的游戏特效，特效的示例还十分有限。由于无法直接将某些游戏APP上的鼠标跟随特效直接应用在Web端，因此需要对网页端实现鼠标跟随特效重新进行开发，以实现网页端对鼠标跟随特效的需求。现有的在Web端实现鼠标跟随特效的实现方法中，可以通过获取鼠标的运动坐标，将运动坐标中相邻的点连起来构成鼠标的运动轨迹，在该鼠标的运动轨迹上实现跟随特效，但是还需要实现擦除两个点之间线段的方法，使得显示出的鼠标的运动轨迹不会像“贪吃蛇”一样越来越长，由于canvas没有提供擦除两个点之间线段的方法，提供的是清除整个画布中的某个位置的矩形内的所有本文档来自技高网...

【技术保护点】
1.一种鼠标跟随特效的实现方法，其特征在于，所述方法包括：/n监听到鼠标操作事件时，获取鼠标在浏览器页面中操作的坐标点；/n将获取的所述坐标点按照事件发生的时间先后顺序依次存储在数组中；/n实时获取所述鼠标在所述浏览器页面经过的坐标点，将实时获取的所述坐标点更新存储在所述数组中；/n将所述数组中存储的两相邻坐标点依次连接成线段，以形成所述鼠标的运动轨迹，并将所述运动轨迹在预先创建的画布中显示；/n在所述浏览器每渲染一次页面帧时，擦除所述画布中显示的所述运动轨迹，获取所述数组中最近一次更新的所述鼠标的坐标点，循环形成所述鼠标的运动轨迹至本步骤直至所述鼠标操作事件停止。/n

【技术特征摘要】
1.一种鼠标跟随特效的实现方法，其特征在于，所述方法包括：
监听到鼠标操作事件时，获取鼠标在浏览器页面中操作的坐标点；
将获取的所述坐标点按照事件发生的时间先后顺序依次存储在数组中；
实时获取所述鼠标在所述浏览器页面经过的坐标点，将实时获取的所述坐标点更新存储在所述数组中；
将所述数组中存储的两相邻坐标点依次连接成线段，以形成所述鼠标的运动轨迹，并将所述运动轨迹在预先创建的画布中显示；
在所述浏览器每渲染一次页面帧时，擦除所述画布中显示的所述运动轨迹，获取所述数组中最近一次更新的所述鼠标的坐标点，循环形成所述鼠标的运动轨迹至本步骤直至所述鼠标操作事件停止。


2.根据权利要求1所述的鼠标跟随特效的实现方法，其特征在于，所述方法还包括：
根据接收的指令创建包括有预设个存储位的所述数组；
在浏览器页面中创建用于显示所述运动轨迹的画布，将所述运动轨迹在所述画布中显示。


3.根据权利要求1所述的鼠标跟随特效的实现方法，其特征在于，所述将获取的所述坐标点按照事件发生的时间先后顺序依次存储在数组中的步骤包括：
首次获取所述鼠标在所述浏览器页面中操作的坐标点时，将最先获取的所述鼠标的坐标点存储在所述数组的最前存储位；
按照获取所述坐标点的时间先后顺序在所述存储位中依次往后存储所述坐标点。


4.根据权利要求1所述的鼠标跟随特效的实现方法，其特征在于，所述将实时获取的所述坐标点更新存储在所述数组中的步骤进一步包括：
判断所述数组的存储位是否存储满，若否，则将实时获取的所述坐标点依次存储在所述数组的尾部，若是，则删除存储在所述数组最前存储位的坐标点且在所述数组的尾部压入新的坐标点。


5.根据权利要求1至4任一项所述的鼠标跟随特效的实现方法，其特征在于，所述方法还包括：
对所述鼠标的运动轨迹添加预设的特...

【专利技术属性】
技术研发人员：李清鹏，
申请(专利权)人：平安科技深圳有限公司，
类型：发明
国别省市：广东;44