物体跟随鼠标移动——图片为gif格式

注意：大的gif图片需要隐藏滚动条。

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title></title></head><!-- 跟随鼠标移动 --><style>body {background-color: #000000;}body::-webkit-scrollbar {display: none;}img {position: absolute;top: 1px;}</style><body><!--跟随鼠标移动  --><img src="./images/xiao.gif" alt="" ><script>var pic = document.querySelector('img');document.addEventListener('mousemove', function(event) {// 1. mousemove只要我们鼠标移动1px 就会触发这个事件// console.log(1);// 2.核心原理： 每次鼠标移动，我们都会获得最新的鼠标坐标， 把这个x和y坐标做为图片的top和left 值就可以移动图片var evt = event || window.event;var x = evt.pageX;var y = evt.pageY;console.log('x坐标是' + x, 'y坐标是' + y);//3 . 千万不要忘记给left 和top 添加px 单位pic.style.left = x - 200 + 'px';pic.style.top = y - 200 + 'px';});</script></body>
</html>

鼠标移到底部大的图片会出现滚动条，所以最好隐藏滚动条

物体跟随鼠标移动——图片为gif格式相关推荐

html图片跟随鼠标,跟随鼠标的图片 - 网页特效代码|网页特效观止 - 让你的网页靓起来！...
跟随鼠标的图片 [ 发布者:在远方┊来源:本站整理┊时间:2006-03-08┊浏览: 人次 ] 网页特效|JsCode.cn|---跟随鼠标的图片 var newtop=0 var newleft= ...
threejs中坐标系转换和实现物体跟随鼠标移动
坐标系转换下面函数可以将鼠标所在点的屏幕坐标转化成一个Threejs三维坐标: convertTo3DCoordinate(clientX,clientY){var mv = new THREE.V ...
Unity协程实现场景中鼠标按住的物体跟随鼠标移动
Unity协程实现场景中的鼠标按住物体跟随鼠标移动 void Awake() { StartCoroutine(OnMouseDown() as IEnumerator); } IEnumerator ...
CocosCreator2.4 物体跟随鼠标或触摸点
CocosCreator2.4 物体跟随鼠标或触摸点前言效果注意事项源码前言项目需求鼠标点击要有效果,移动要跟随,但是看了文档发现坐标系转换会有问题,于是记录下. 效果注意事项使用cc ...
unity2d 实现物体跟随鼠标绕一个点旋转效果
在2D游戏中,类似泡泡龙炮台发射.敌人飞机永远指向PLAYER.愤怒小鸟弹弓发射等效果,都需要用到物体跟随鼠标绕一个点旋转的效果,在unity中实现代码很简单,但是在理解上有一定障碍,因为unity是 ...
Unity让物体跟随鼠标移动
前言最近在学习Unity,记录下学习的成果吧.本文最终结果是要实现一个小飞机跟随鼠标移动的效果.看下图片. 向量在Unity中,每个对象都有自己的位置属性,组件叫做Transform,通过Tran ...
html浮动跟随鼠标,jQuery 图片跟随鼠标浮动
不知你有没注意到我的网站首页,上面浮动着一层雪花的背景,并且随着鼠标的移动也在移动着. 本文主要讲述了如何判断鼠标的位置,从而实现图片跟随鼠标进行浮动.为了方便查看和理解,在Demo的左下角把各个参数 ...
【Unity】OnTriggerStay2D无法触发问题，物体跟随鼠标等背包系统以及UI场景交互系统技术总结
背包系统以及交互交互实现技术总结 OnTriggerStay2D无法碰撞检测跟随鼠标移动跟着麦扣老师学习的背包系统之后,因为参加GameJam后现在码了背包和场景交互,但是都有些bug,最近重 ...
Unity3D 鼠标拖动和旋转物体以及鼠标拖动图片
1.鼠标拖动物体Cube using System.Collections; using System.Collections.Generic; using UnityEngine; using Un ...

物体跟随鼠标移动——图片为gif格式

物体跟随鼠标移动——图片为gif格式相关推荐

最新文章

热门文章