<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title>自定义动画</title>

        <script src="js/jquery.js"></script>

        <style>

        .me1{

            position: absolute;

            left: %;

            top: %;

            margin-left: -150px;

            margin-top: -;

            width: 400px;

            height: 100px;

            background-color: orange;

            overflow: auto;

            padding: 10px;

            border: 30px solid lightblue;

        }

        .me2{

            position: absolute;

            left: %;

            top: %;

            margin-left: -200px;

            margin-top: -;

            width: 400px;

            height: 100px;

            background-color: blue;

            overflow: auto;

            padding: 10px;

            border: 30px solid orange;

        }

        </style>

        <script type="text/javascript">

            //页面加载完成简写形式

            $(function(){

                //animate 第一参数 目标值 第二个参数持续时间

            $(".me1").animate({left:"60%",top:"80%",width:"5%",height:"5%",borderWidth:"1px"},

                              {queue:true, duration: } //queue使用队列动画

                              )

            $(".me1").animate({left:"20%",top:"50%",width:"20%",height:"20%",borderWidth:"30px"},

                              {queue:true, duration: } //queue使用队列动画

                              )

            })

        </script>

    </head>

    <body>

        <div class="me1"></div>

        <div class="me2"></div>

    </body>

</html>

jQuery学习-自定义动画的更多相关文章

  1. 11.jQuery之自定义动画

    注意:animate里面是一个对象,他有几个参数,详情可以参考官网 <style> div { position: absolute; width: 200px; height: 200p ...

  2. 深入学习jQuery自定义动画

    × 目录 [1]属性对象 [2]可选参数 [3]选项参数 前面的话 很多情况下,前面介绍的jQuery动画的简单效果无法满足用户的各种需求,那么就需要对动画有更多的限制,需要采取一些高级的自定义动画来 ...

  3. Day048--jQuery自定义动画和DOM操作

    内容回顾 BOM location.reload() 全局刷新页面 location.href location.hash location.pathname location.hostname lo ...

  4. python全栈开发day48-jqurey自定义动画，jQuery属性操作，jQuery的文档操作，jQuery中的ajax

    一.昨日内容回顾 1.jQuery初识 1).使用jQuery而非JS的六大理由 2).jQuery对象和js对象转换 3).jQuery的两大特点 4).jQuery的入口函数三大写法 5).jQu ...

  5. jquery学习笔记(四)：动画

    内容来自[汇智网]jquery学习课程 4.1 显示和隐藏 在jQuery中使用 hide() 和 show() 方法来隐藏和显示 HTML 元素: hide()的语法形式:$(selector).h ...

  6. jQuery学习之路（4）- 动画

    ▓▓▓▓▓▓ 大致介绍 通过jQuery中基本的动画方法,能够轻松地为网页添加非常精彩的视觉效果,给用户一种全新的体验 ▓▓▓▓▓▓ jQuery中的动画 ▓▓▓▓▓▓ show()和hide()方法 ...

  7. Android开发学习之路-RecyclerView的Item自定义动画及DefaultItemAnimator源码分析

    这是关于RecyclerView的第二篇,说的是如何自定义Item动画,但是请注意,本文不包含动画的具体实现方法,只是告诉大家如何去自定义动画,如何去参考源代码. 我们知道,RecyclerView默 ...

  8. jQuery学习笔记（四）jQuery中的动画

    目录 show()方法和hide()方法 fideIn()方法和fadeOut()方法 slideUp方法和slideDown()方法 自定义动画方法animate toogle(),slideTog ...

  9. jQuery学习-css、class操作、动画方法的运用、jQ操作Dom节点

    css操作(设置单个/多个样式.获取样式) //修改单个属性:括号之中直接是需要修改的样式名,值 css(name,value) //例:$("#one").css("b ...

随机推荐

  1. C++ 入门随手笔记及联系

    一.第一个C++程序 1.文件扩展名  C++源代码的文件扩展名.cpp.C.cxx.c(需要指定编译语言)  自定义的头文件依然保留.h 2.头文件  C++标准库的头文件不带.h,最常用的是ios ...

  2. 动态展开tableView的cell[2]

    动态展开tableView的cell[2] http://code4app.com/ios/%E5%8A%A8%E6%80%81%E6%B7%BB%E5%8A%A0cell/53845f8a933bf ...

  3. GitBlit集成AD域LDAP

    GitBlit的配置文件: gitlblit安装目录下的 /data/gitblit.properties   ,用记事本或其他编译器打开即可. 集成AD域的LDAP操作步骤 打开配置文件,添加以下内 ...

  4. zabbix日常监控项TCP连接状态（六）

    TCP的连接状态对于我们web服务器来说是至关重要的,尤其是并发量ESTAB或者是syn_recv值,假如这个值比较大的话我们可以认为是不是受到了攻击,或是time_wait值比较高的话,我们要考虑看 ...

  5. C++浅拷贝和深拷贝的区别

    C++浅拷贝和深拷贝的区别 2012-04-24 21:22 11454人阅读 评论(6) 收藏 举报 c++deleteclass编译器c c++默认的拷贝构造函数是浅拷贝 浅拷贝就是对象的数据成员 ...

  6. Mysql 漏洞利用（越权读取文件，实战怎么从低权限拿到root密码）[转]

    cnrstar (Be My Personal Best!) | 2014-05-20 21:58 众所周知,Mysql的用户在没有File权限情况下是无法通过Load_file读文件或者通过into ...

  7. 原生js实现一个DIV的碰撞反弹运动，并且添加重力效果

    继上一篇... 原生js实现一个DIV的碰撞反弹运动,并且添加重力效果 关键在于边界检测,以及乘以的系数问题,实现代码并不难,如下: <!DOCTYPE html> <html la ...

  8. 《Python核心编程》笔记

    1 python是大小写敏感的 2 遍历一个字典的键值: for a in dict_obj.keys(): print a 3 列表解析功能可以让代码很简洁,比如:squared = [x ** 2 ...

  9. css背景精华所在+前端页面开发流程

    background属性 background属性是css中应用比较多,且比较重要的一个属性,它是负责给盒子设置背景图片和背景颜色的,background是一个复合属性,它可以分解成如下几个设置项: ...

  10. wk_06.md

    IO与文件操作 文件内建函数open 内建函数open提供了初始化输入/输出(I/O)操作的通用接口.open()内建函数成功打开文件后会返回一个文件对象.open函数的语法如下: open(file ...