1. 不只是jquery的 animate 动画, 才有时间的 参数, 实际上, 在所有的动画中, 包括: show/hide/toggle, slideup/slidedown/slidetoggle, fadein/fadeout/fadeto, animate 等, 都有速度(即动画切换速度时间)参数. 即所有的动画都有: speed, ease, callbackFn 三个参数.

  2. 不要以为只有jquery的动画只有 "垂直方向", 实际上, 在水平方向上的动画是 一样的, 也可以实现, 那就是,, 通过animate的 "width: 变化来实现"..

  3. 动画 的组合? 你可以在一个 动画中, 同时实现多个参数的改变, 那么这时后, 这些选项参数的改变是同时的, 如width 和 height 同时改变; 但是 有时候, 却需要 多个选项, 多个参数的改变, 不是同时的, 而是一个一个的发生的, 即前面一个 height 高度 实现动画完成后, 然后再让 width宽度 实现动画 改变. 这就要看你的实际需求了...

  4. 关于多个事件的切换? 直接就提供了两个方法, 一个是 hover(在over, out之间切换), 一个是toggle(f1, f2, f3, f4....). 这个hover就整合了 mouseover 和 mouseout两个事件. 它实际生活就相当于 两个事件的 toggle! 是一种特殊形式 toggle.

  5. 关于filter的用法
    filter是过滤出 符合 后面的表达式 的元素(或元素集合). filter过滤出的是我们要保留的结果: 其中 过滤表达式 "可以" 是多个表达式, 相互之间用 逗号隔开, 注意,这些过滤表达式, 是 "或" "or" 的关系, 不是"与 and"的关系. 不是说这些过滤表达式要同时满足, 才能得到结果, 而是说只要 满足其中 任意 一个过滤表达式的 元素 都将被筛选出来.

  6. jquery中的options选项的 格式, {attr, value} , 前面的 attr表示的是属性名称 , 这里是表示的关键字, 所以不用加引号. 这个跟json格式 字符串不同!

  7. ‵ $(':not(:animated'), filter(':not(:animated)') ` , 中的 :animated表示 正在 执行动画的元素, 其中的 animated 是表示被动语态, 而不是表示 完成时

jquery 中的 选择器, 即$ 括号中的 内容, 不管有 多少, 都只是 用一个 引号. 不必添加单引号 双引号什么的!

关于 hover显示和隐藏 的思路 的扩展!! 很重要!!

  1. 既要重视以前的 hover方法, 但是, 也要 避免 "什么都是hover, 只要一看到 显示和隐藏就是 hover" 的这种思想!
    以前我们都是 将 "触发"和 "显示的" 部分作为 两个部分来 做的,可以这么做, 并不是不可以, 那么这时后, 就要注意处理 触发和显示两部分之间的 空白过渡区域.
    (markdown的列表, 并不是不可以换行的! 只要换行中不包括 空白行就可以! 因为 在markdown中 , 空白行表示的是 "段落"! 只要没有空白行, 就表示始终是同一个段落!)

  2. 但是前面的第一种方法 总是有些 麻烦 "不优雅", 很别扭的. 所以可以使用第二种思路: 将"触发 和 显示" 部分, 作为一个 整体 部分 , 把它们放在 同一个div中, 然后
    使用animate来 控制 水平方向的width/ 垂直方向上用height 动画, 而且动画的width和height 就不显示或隐藏 完了, 只是到 "触发部分"就好了!! 这样就很好的解决了触发和显示 部分之间的 过渡地段 的问题.

  3. 总之, 就是 不管触发和 显示区域的大小是否相同, 总是可以把 它们放在一起, 都放在一个div中 来进行显示的. 三个选择: 一是 可以将触发和显示作为 并列元素, 二是将 触发和显示 放在一个div 大的容器中(这是最常用的方式); 三是将触发和 显示 都分别作为 一个div, 放到一个父div中. 反正根据需要来看 . 因为 , 一个div 中包含 的 子元素, 不一定尺寸(宽度和高度)都是一样 的 . 即使 包含的子元素的 宽 高 不一样, 也可以作为一个整体 来进行设置!

  4. 不管是采用 哪种方法, 如果出现问题, 总是考虑: stop(true, true), 或 $('selecctor'). filter(':not(:animated)'). 动画方法! 来消除 "动画积累"的问题!!

在jquery中, 凡是要用来测试的, 都[可以] 使用is 函数: is(expr | jquery obj| dom ele| fn). 其中的expr表达式, 是css selector选择器!! 如: $('selector').is('form', ':visible',....) 其中, :visible是 选择器, 是可见性 选择器!

在使用 jquery方法的时候, 要求options时一个 大括号引起的 map, 通常, 最后一个option后, 你可以加逗号, 也可以不加逗号, 但是对于ie, 有时候 如果你在 最后一项option的后面加了 逗号的话, 可能会产生 意外的 错误. 所以, 最好是 "最后一个option后, 不加逗号"

vim的标尺, 指的是, vim最底部的 指示当前光标所在的行数/列数 位置的 indicator. 这个就是标尺, 还是比较有用的. 它不同于 word 等中在最顶端的 虚线形式的标尺 ...

关于jquery所有动画都有速度和动画的方向(在宽度方向上的动画)?的更多相关文章

  1. JQuery总结:选择器归纳、DOM遍历和事件处理、DOM完全操作和动画 (转)

    JQuery总结:选择器归纳.DOM遍历和事件处理.DOM完全操作和动画 转至元数据结尾 我们后台可能用到的页面一般都是用jquery取值赋值的,发现一片不错的文章 目录 JQuery总结一:选择器归 ...

  2. 微信小程序开发动感十足的加载动画--都在这里!

    代码地址如下:http://www.demodashi.com/demo/14242.html 一.前期准备工作 软件环境:微信开发者工具 官方下载地址:https://mp.weixin.qq.co ...

  3. 用HTML和CSS实现WWDC 2015上的动画效果

    用HTML和CSS实现WWDC 2015上的动画效果 动画效果WWDC 2015   原文:https://cssanimation.rocks/wwdc15/ 译者:周晓楷(@Helkyle) 每年 ...

  4. 用jQuery做一个三级菜单,鼠标移动到二级菜单的选项上,然后再迅速离开后,当鼠标再移动到该一级菜单或其他二级菜单选项,三级菜单也会显示。

    用jQuery做一个三级菜单,鼠标移动到二级菜单的选项上,然后再迅速离开后,当鼠标再移动到该一级菜单或其他二级菜单选项,三级菜单也会显示. 原因:在为一个元素绑定hover事件之后,用户把光标移入元素 ...

  5. Unity3D之Mecanim动画系统学习笔记(七):IK(反向动力学)动画

    什么是IK? IK(Inverse Kinematics)即反向动力学,即可以使用场景中的各种物体来控制和影响角色身体部位的运动,一般来说骨骼动画都是传统的从父节点到子节点的带动方式(即正向动力学), ...

  6. css3 动画应用 animations 和transtions transform在加上JavaScript 可以实现硬件加速动画。

    transitions(过渡) 被应用于元素指定的属性变化时,该属性经过一段时间逐渐的过渡到最终想要的值. 主要包括四个属性: 执行变换的属性:transition-property 变换延续的时间: ...

  7. Android动画之仿美团加载数据等待时,小人奔跑进度动画对话框(附顺丰快递员奔跑效果)

    Android动画之仿美团加载数据等待时,小人奔跑进度动画对话框(附顺丰快递员奔跑效果) 首句依然是那句老话,你懂得! finddreams :(http://blog.csdn.net/finddr ...

  8. IOS 暂停和恢复CALayer上的动画(转)

    coreAnimation的动画是存在于CALayer上面的,有些时候需要突然暂停某个组件的动画效果,同时保留当前动画的状态, 如果是用removeAnimation会显得很突兀,不够平滑,所以可以利 ...

  9. 发布上线前,先小秀一把俺的64位浏览器,速度那觉对是杠杠滴,上youtube,上google不费劲

    发布上线前,先小秀一把俺的64位浏览器,速度那觉对是杠杠滴,上youtube,上google不费劲

随机推荐

  1. pandas2

    1.Series创建的方法统一为pd.Series(data,index=)(1,2,3)Series可以通过三种形式创建:python的dict.numpy当中的ndarray(numpy中的基本数 ...

  2. vue-cli搭建vue项目更新

    vue-cli搭建vue项目更新 更新之前一篇博客错误的地方,在使用vue init webpack xxx 之后并不需要使用npm install 下载依赖包,而是直接根据提示 打开文件夹 再npm ...

  3. <!DOCTYPE html>有什么用?

    <!DOCTYPE html> 是文档声明,必须放在文档第一行,它的作用就是告诉浏览器以哪个html版本来解析你的html代码.当你不写声明的时候,浏览器就会以自己的怪异模式来解析你的ht ...

  4. 新建虚拟机_WIN7 32位系统

    准备工作:下载win7 32位纯净版镜像文件 大部分步骤与安装XP系统相似,此处只说明一下不同: 创建好虚拟机后启动有报错:CHS data ERROR,无法从CD/DVD启动 编辑虚拟机--> ...

  5. 易忘的mysql语句

    1.修改主键 ALTER TABLE `resource` DROP PRIMARY KEY ,ADD PRIMARY KEY ( `rid` ) 2.加上auto_increment ) NOT N ...

  6. nodejs(二)child_process模块

    1.child_process是Node.js的一个十分重要的模块,通过它可以实现创建多进程,以利用多核计算资源. child_process模块提供了四个创建子进程的函数,分别是spawn,exec ...

  7. 12.预处理数据的方法总结(使用sklearn-preprocessing)

    https://blog.csdn.net/sinat_33761963/article/details/53433799

  8. Java的jdk1.6与jre1.8中存在的差异

    一般来说: jdk每一个版本都是向后兼容的,说以低版本的代码是可以运行在高版本的虚拟机上的.而反过来则不可以,用1.6的编译器编辑的字节码文件是不可以运行在1.5版本的虚拟机上的. 但是今天我用Sun ...

  9. linux字符处理命令 sort(部分转载)

    [root@LocalWeb01 ~]# sort /etc/passwd |less   (升序 ) [root@LocalWeb01 ~]# sort -r /etc/passwd |less ( ...

  10. mysql参数配置文件

    (1)参数配置文件中的内容以键值对形式存在. (2)如何查看键值对?show variables like '%name%';或者查看information_schema库下的global_varia ...