<!DOCTYPE HTML>
<html>
<head>
    <meta charset=utf-8 />
    <title>UFO来了</title>
    <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
    <style>
    .box{
        width:200px;
        height: 1000px;
        position:absolute;
        background-color: rebeccapurple;
    }
    </style>
</head>
<body>
    <button class="btnn">开始吧</button>
    <div class="box"></div>
    <script>
    $('.btnn').on('click',function (){
         $('.box').animate({'left':'1200px'},500,function () {  <!--这里不明白为啥不能用‘right’：0px 欢迎给大佬解答-->
            $(this).animate({'left':'0px'},500,function () {
                $('.btnn').click()
            })
        })
    })

    </script>
</body>
</html>

Jquery实现div左右重复来回走动的更多相关文章

  1. jquery给div,Span, a ，button, radio 赋值取值

    jquery给div的innerHTML赋值 $("#id").html()="test"; //或者 $("#id").html(&quo ...

  2. jquery判断div是否显示或者隐藏

    jquery判断div是否显示或者隐藏 很多时候会要判断一个div是不是显示着,没显示要怎么处理,显示的如何处理: 方法很简单,选择到你要判断的div,再用is(':hidden')判断是否隐藏:或者 ...

  3. jquery实现DIV层拖动

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  4. JavaScript和JQuery获取DIV的值

    1.设计源代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www ...

  5. jquery用div模拟一个下拉列表框

    原文 jquery用div模拟一个下拉列表框 今天分享一个用我自己用jquery写的,用div模拟下拉列表select,这个效果网上有很多,但是写一个有自己思路的代码效果,更有成就感,先看截图: 自我 ...

  6. 如何用jQuery实现div随鼠标移动而移动（详解）？----2017-05-12

    重点是弄清楚如何获取鼠标现位置与移动后位置,div现在位置与移动后位置: 用jQuery实现div随鼠标移动而移动,不是鼠标自身的位置!!而是div相对于之前位置的移动 代码如下:(注意看绿色部分的解 ...

  7. 【如何使用jQuery】【jQuery弹出框】【jQuery对div进行操作】【jQuery对class，id，type的操作】【jquery选择器】

    1.如何使用jQuery jQuery是一个快速.简洁的JavaScript框架,是继Prototype之后又一个优秀的JavaScript代码库(或JavaScript框架).jQuery设计的宗旨 ...

  8. jquery的div局部刷新

    jquery的div局部刷新 //div的局部刷新 $(".dl").load(location.href+" .dl"); 全页面的刷新方法 window.l ...

  9. jQuery事件-div的显示隐藏及鼠标的移入移出

    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...

随机推荐

  1. Windows文件共享配置与遇到的问题

    一.Windows 7 访问共享文件权限不足 问题 最近在 Windows 10 上共享了一个文件夹,并创建了一个用户,用于在别人访问该共享文件夹时进行认证,但是在一个同事的电脑(Windows7,当 ...

  2. （电脑重置之后）win10在桌面点右键鼠标一直转圈；无法点击桌面图标；

    昨天重置系统之后,发现了这个毛病.桌面任务栏都能正常点击,就是一到桌面,无法点击桌面上面的图标(刚开机的时候还可以点).想新建文件夹来着,一点右键,鼠标即开始转圈圈.本来以为自己能好,结果第二天了还这 ...

  3. Charlie's Change POJ - 1787

    Time limit 1000 ms Memory limit 30000 kB description Charlie is a driver of Advanced Cargo Movement, ...

  4. Ansible 清单与命令解析

    在大规模的配置管理工作中我们需要管理不同业务的不同机器,这些机器的信息都存放在 Ansible 的 Inventory 组件里面,在我们工作中配置部署针对的主机必须先存放在 Invento 组里面,这 ...

  5. Bicolored RBS CodeForces - 1167D (括号)

    建树, 然后高度最大值的最小值显然为$\lceil \frac{dep}{2}\rceil$, 将$>\frac{dep}{2}$的全部分出去即可. #include <sstream&g ...

  6. python网络爬虫（7）爬取静态数据详解

    目的 爬取http://seputu.com/数据并存储csv文件 导入库 lxml用于解析解析网页HTML等源码,提取数据.一些参考:https://www.cnblogs.com/zhangxin ...

  7. centos7 安装vim

    刚安装的centos7一般只有vi可以用,vim是没有安装的,如果我们想使用的话,需要我们自己去安装,可以使用如下命令进行安装: yum -y install vim 安装之后就可以正常使用

  8. 使用mybatis插件自动生成代码以及问题处理

    1.pom.xml中加入依赖插件 <!-- mybatis generator 自动生成代码插件 --> <plugin> <groupId>org.mybatis ...

  9. Elasticsearch入门教程(五)：Elasticsearch查询(一)

    原文:Elasticsearch入门教程(五):Elasticsearch查询(一) 版权声明:本文为博主原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明. 本文链接:h ...

  10. JS图片轮播[左右轮播

    直接可以用,网上摘下来的! <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http ...