动画事件

.hide(option) 动画隐藏  会保存元素的原始属性值

$("#a2").hide({

duration: 3000,
complete: function() {
alert('执行3000ms动画完毕')
}
})

.show(option)动画显示

show与hide方法是修改的display属性,通过是visibility属性布局需要通过css方法单独设置

如果使用!important在你的样式中,比如display: none !important,如果你希望.show()方法正常工作,必须使用.css('display', 'block !important')重写样式
如果让show与hide成为一个动画,那么默认执行动画会改变元素的高度,高度,透明度

.toggle(option) 隐藏或显示切换 内在原理还是用的.hide()和.show()

$("button:last").click(function() {
$(".right").toggle(3000);
});

.toggle()还可以模拟鼠标单机事件(jquery 1.8版本此功能被移除)

.toggle(function(){

alert("a");

},function(){

alert("a");

})

注意 jquery动画要在标准模式下进行,否则会引起抖动。现在简写可以是<!DOCTYPE html>

jquery总结06-动画事件01-基础显示和隐藏的更多相关文章

  1. jQuery将物体居中,并且转换显示和隐藏

    今天来给大家贴一段代码,代码的作用就是利用jQuery将物体居中,并且转换显示和隐藏: 首先建立一个div标签并且写好css样式,具体如下 然后我想要的效果是当我点击了button这个按钮,test可 ...

  2. jquery实现点击控制div的显示和隐藏

    我们使用点击显示.点击隐藏的时候,一般有两种可选方案 .示例 html <div class="index"> <h1> 首页 </h1> &l ...

  3. jquery 点击按钮实现listbox的显示与隐藏,点击其他地方按钮外的地方,隐藏listbox

    本来不知道如何获取服务器的控件的,这下知道可以这么做了,所以记录下来.... <asp:ImageButton ID="alltime" ImageUrl="ima ...

  4. jQuery应用实例3:鼠标经过显示离开隐藏

    效果: 代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="U ...

  5. 利用jquery 实现菜单控制对应视图的显示与隐藏

    效果: <!DOCTYPE html> <html lang="en" dir="ltr"> <head> <meta ...

  6. 教你三种jQuery框架实现元素显示及隐藏动画方式

    摘要:在jQuery框架中对元素对象进行显示和隐藏有三种方式,分别是"默认方式显示和隐藏"."滑动方式显示和隐藏"."淡入淡出显示和隐藏". ...

  7. angularJs:动态效果之:显示与隐藏(该例对比了普通赋值,层次赋值,事件的写法对比)

    testShowAndHiddern.html <!DOCTYPE html> <html ng-app="MyModule"> <head> ...

  8. jQuery判断当前元素显示状态并控制元素的显示与隐藏

    1.jQuery判断一个元素当前状态是显示还是隐藏 $("#id").is(':visible');   //true为显示,false为隐藏 $("#id") ...

  9. jQuery里面的常用的事件和基础动画的实现

    一:了解jquery里面常用的事件 二:了解基础动画的实现 1:加载DOM 在JavaScript中使用window.onload事件作为窗体加载事件(它在页面所有数据加载完成之后才会执行) 在jQu ...

随机推荐

  1. Git Cheat Sheet

    Merge Undo git merge with conflicts $ git merge --abort Archive $ git archive --format zip --output ...

  2. SourceTree如何连接ssh的仓库地址,这里记录的是客户端需要做的事

    1. 2. 打开命令行以后输入ssh-keygen -t rsa -C "example@example.com"',这个地方输入的是你注册gitlab所使用的邮箱.按回车,之后还 ...

  3. 【进展】LL谱面存储方式的改善

    今天得某位高人相助,获得了一堆LL里面的标准谱面文件,是json格式的.于是折腾了一下午加一晚上,总算让SLP正确解析了json格式的谱面.

  4. 在windows 与Linux间实现文件传输(C++&C实现)

    要实现windows与linux间的文件传输,可以通过socket网络编程来实现. 这次要实现的功能与<Windows下通过socket进行字符串和文件传输>中实现的功能相同,即客户端首先 ...

  5. python pymysql和orm

    pymsql是Python中操作MySQL的模块,其使用方法和MySQLdb几乎相同. 1. 安装 管理员打开cmd,切换到python的安装路径,进入到Scripts目录下(如:C:\Users\A ...

  6. 关于使用FusionCharts生成图表时出现invalid xml data错误提示的解决方法

    FusionCharts的确功能是够强大的.收集的功能估计更强大.在初次使用时,对着手册,一步一步操作,就是生成图表工具不成功.一直报"Invalid xml data"错误.后面 ...

  7. "_OBJC_CLASS_$_AddFriendPageItem", referenced from:

    该出错是指:有些头文件没有导入到  TARGETS  中的Build Phases - Compile Sources 中

  8. C++数组实现的循环队列

    #include<iostream> #include <string> /* 功能:数组实现的循环队列,C++实现,学习参考 */ using namespace std; ...

  9. Android中处理崩溃异常和记录日志

    大家都知道,现在安装Android系统的手机版本和设备千差万别,在模拟器上运行良好的程序安装到某款手机上说不定就出现崩溃的现象,开发者个人不可能购买所有设备逐个调试,所以在程序发布出去之后,如果出现了 ...

  10. Base64 的那些事儿

    一.Base64是什么? Base64是一种编码的格式.是将信息流(字节流)按照一定的规范,重新组合,显示出完全不相关内容的编码格式. ps.定义是我自己总结的,我觉得对于知识的定义,只要简洁,不错误 ...