tnblog
首页
视频
资源
登录

jqurey 用 keydown让图片上下左右移

5127人阅读 2019/8/29 17:08 总访问:106933 评论:0 收藏:0 手机
分类: jquery

$(function(){
            
            $(document).keydown(function(event){
                //获取按下的键
                var tu = event.which;
                //移动速度
                var yi = 10;
                //获取img当前的位置
                var top = parseInt($("#img").css("top"));
                var left = parseInt($("#img").css("left"));

                if(tu==37)//左
                {
                    left -= yi;
                }
                if(tu==39)//右
                {
                    left += yi;
                }
                if(tu==40)//下
                {
                    top += yi;
                }
                if(tu==38)//上
                {
                    top -= yi;
                }
                if(top<20)
                {
                    top=20;
                }
                if(top>500)//左
                {
                    top= 500;
                }
                if(left<20)//右
                {
                    left = 20;
                }
                if(left>1220)
                {
                    left=1220;
                }
                $("#img").css("top",top);
                $("#img").css("left",left);
            });
        });


         <img id="img" src="img/5.gif" style="position:absolute; top:250px; left:600px;"/>



评价
希望你懂得很多之后,依旧热爱生活
排名
6
文章
6
粉丝
16
评论
8
{{item.articleTitle}}
{{item.blogName}} : {{item.content}}
ICP备案 :渝ICP备18016597号-1
网站信息:2018-2024TNBLOG.NET
技术交流:群号656732739
联系我们:contact@tnblog.net
公网安备:50010702506256
欢迎加群交流技术