时间:2021-07-01 10:21:17 帮助过:28人阅读
实现一个用于网站主页面 从窗体左上角开始飘到右下角 之后又飘到右上角 十秒之后消失的效果。
二、需求分析:
首先 应当想要漂浮的内容放在一个容器内,也就是一个DIV,设计它的样式,不管是背景图片还是文字,甚至是一段多媒体视频等。
其次 要想实现漂浮 这个DIV就不能处于文档流中 否则因为它一定会收到其他HTML内元素的影响 而不能自由移动。漂浮的本质就是
窗体中位置的改变,并且这种改变不能在瞬间完成 而是可以预定时间完成转移。
再次 在DIV移动位置过程中 当鼠标经过时应停止移动 鼠标移开移动继续
最后 移动到结束位置后div消失 漂浮结束
三、代码实现:
html页面引入CSS和JS文件 如下: