jquery总结06-动画事件01-基础显示和隐藏
动画事件
.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-基础显示和隐藏的更多相关文章
- jQuery将物体居中,并且转换显示和隐藏
今天来给大家贴一段代码,代码的作用就是利用jQuery将物体居中,并且转换显示和隐藏: 首先建立一个div标签并且写好css样式,具体如下 然后我想要的效果是当我点击了button这个按钮,test可 ...
- jquery实现点击控制div的显示和隐藏
我们使用点击显示.点击隐藏的时候,一般有两种可选方案 .示例 html <div class="index"> <h1> 首页 </h1> &l ...
- jquery 点击按钮实现listbox的显示与隐藏,点击其他地方按钮外的地方,隐藏listbox
本来不知道如何获取服务器的控件的,这下知道可以这么做了,所以记录下来.... <asp:ImageButton ID="alltime" ImageUrl="ima ...
- jQuery应用实例3:鼠标经过显示离开隐藏
效果: 代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="U ...
- 利用jquery 实现菜单控制对应视图的显示与隐藏
效果: <!DOCTYPE html> <html lang="en" dir="ltr"> <head> <meta ...
- 教你三种jQuery框架实现元素显示及隐藏动画方式
摘要:在jQuery框架中对元素对象进行显示和隐藏有三种方式,分别是"默认方式显示和隐藏"."滑动方式显示和隐藏"."淡入淡出显示和隐藏". ...
- angularJs:动态效果之:显示与隐藏(该例对比了普通赋值,层次赋值,事件的写法对比)
testShowAndHiddern.html <!DOCTYPE html> <html ng-app="MyModule"> <head> ...
- jQuery判断当前元素显示状态并控制元素的显示与隐藏
1.jQuery判断一个元素当前状态是显示还是隐藏 $("#id").is(':visible'); //true为显示,false为隐藏 $("#id") ...
- jQuery里面的常用的事件和基础动画的实现
一:了解jquery里面常用的事件 二:了解基础动画的实现 1:加载DOM 在JavaScript中使用window.onload事件作为窗体加载事件(它在页面所有数据加载完成之后才会执行) 在jQu ...
随机推荐
- New line
The concepts of line feed (LF) and carriage return (CR) are closely associated, and can be either co ...
- ubuntu14.04下安装python3.4.2
1. python安装包的下载地址:https://www.python.org/downloads/ 我的python安装包下载地址:https://www.python.org/ftp/pytho ...
- ios-深度解析二维码的生成与使用
利用一个小demo来对二维码进行学习,总共四个界面(主界面,生成二维码界面,识别二维码界面,扫描二维码界面) 一.二维码的介绍 1.什么是二维码? 二维条码/二维码是用某种特定的 ...
- Windows Phone 十七、Socket
Socket 常用类型 StreamSocket:Socket对象 StreamSocketListener:Socket监听对象,适用于服务端 服务端代码 <Grid x:Name=" ...
- 使用git
原文出处: 涂根华的博客 一:Git是什么? Git是目前世界上最先进的分布式版本控制系统. 二:SVN与Git的最主要的区别? SVN是集中式版本控制系统,版本库是集中放在中央服务器的,而干活的时候 ...
- 安装hive+mysql
1.源码安装mysql 以root用户首先安装libaio-0.3.104.tar.gz tar zxvf libaio-0.3.104.tar.gz cd libaio-0.3.104 make p ...
- CentOs中yum安装LAMP+PHPMYADMIN
对于租用以及VPS,提供在Linux安装LAMP(Linux+Apache+mysql+PHP),对于这个组件,不做过多的解释,网上很多这方面的资料.下面只介绍一种安装方法,作为以后使用的一个简单文档 ...
- Qt之QStringList讲解
QStringList类提供了一个字符串列表 从QString继承而来,它提供快速索引为基础的接入以及快速插入和清除. 成员函数用于操作这个字符串列表如: append(),insert(),repl ...
- android 布局学习
各种layout用到的一些重要属性 第一类:属性值为true或false android:layout_centerHrizontal 水平居中 android:layout_centerVertic ...
- SSM——(二):easyUI的CRUD
1.在WebContent下新建admin目录,添加index.html(用来显示user表的CRUD): 总结: 1.datagrid接收的必须是json数据: 2.使用分页插件会自动向后台传递St ...