为什么我按照本视频，全部一样的键入后，无法完成图片随鼠标飞行的效果？ 代码见视频（一模一样） 自己思索后，发现此图可能需要定位后才能自由飞行，故给“天使图”加了一条 <style> #ts { position: relative; } </style> 相对定位成功后，图片成功随鼠标飞行，望老师解答，谢谢
回答
云松回答
问题分析：
在HTML页面中，可以位置移动的属性只有通过定位实现，定位实现有三种情况，固定定位，绝对定位，相对定位
固定定位：相对于浏览器窗口进行定位，脱离文档流位置
相对定位：相对于自己原来的位置进行定位，保留文档流位置
绝对定位：相对于最近的父元素的定位进行定位，如果父元素没有定位，则相对于body定位。脱离文档流。
所以，如果你想让图片跟随鼠标移动，你就需要获取鼠标的位置，然后重新设定图片的位置（即给图片重新定位）。
问题解答：
如果图片移动范围为整个浏览器可视区域，则建议是使用绝对定位，如果不是整个浏览器可视区域，则建议给图片的活动范围元素加相对定位，然后给图片添加绝对定位。
原因就是相对定位不会脱离文档流
绝对定位可以脱离文档流。
(0)