如何使用JavaScript制一个飘浮的图片效果
编辑：Simone
2025-02-19 05:32:48
559 阅读
页面中漂浮的图片是早期页面中最常见的广告特效之一，现在的很多页面也依然在使用，下面我们分享一下飘浮的图片是如何实现的，最终的预览效果如下所示：
编写效果所需的HTML代码，非常简单，加入一个
标签即可，代码如下图所示：
对HTML进行必要的CSS控制，具体代码如下图所示：
定义HTML元素移动1像素的一个函数，具体代码如下：
加入计时器，每30毫秒调用一次，这样图片就可以动起来了，代码如下图所示：
再添加代码，当鼠标悬停到图片时停止滚动，当离开时图片时继续滚动，代码如下所示：
打开浏览器进行预览，图片飘浮起来了，效果不错吧？赶快动手试试吧！
版权声明：本站【趣百科】文章素材来源于网络或者用户投稿，未经许可不得用于商用，如转载保留本文链接：https://www.qubaik.com/article/138960.html
