javascript实现图片左右移动动画

来源：互联网发布：洛克希德马丁公司知乎编辑：程序博客网时间：2024/05/18 02:00

图片的左右移动，具备像荡秋千一样的动画效果，图片自己可重新定义，移动速度和距离也可在代码内设定，挺简单的Js生成动画的特效代码，仅供参考。

<!DOCTYPE html><html><head lang="en">    <meta charset="UTF-8">    <title>自定义动画</title>    <script type="text/javascript" src="jquery.1.12.4.js"></script>    <style>        * {            margin: 0;        }    </style>    <script type="text/javascript">        var moveToLeft = function () {            $("#topImg").animate({"left": "0"}, "slow", moveToRight);        };        var moveToRight = function () {            $("#topImg").animate({"left": "100px"}, "slow", moveToLeft);        };        $(function () {            $("button").click(moveToRight);        });    </script></head><body><button>点击我右移100px</button><br/><br/><br/><br/><img id="topImg" style="position: absolute; left: 0" src="图片1_30.jpg"/></body></html>

阅读全文

0 0