jquery笔记(效果)
显示/隐藏:
$(selector).hide(speed, function()):隐藏
$(selector).show(speed, function()):隐藏
$(selector).toggle(speed, function()):显示/隐藏切换
淡入/淡出:
$(selector).fadeIn(speed, function()):淡入,必须先把元素隐藏掉(display:none)
$(selector).fadeOut(speed, function()):淡出,即慢慢的隐藏掉
$(selector).fadeToggle(speed, function()):淡入/淡出切换
$(selector).fadeTo(speed,opacity,function());:方法允许渐变为给定的不透明度(值介于 0 与 1 之间)
滑动:
$(selector).slideDown(speed,function()):向下滑动
$(selector).slideUp(speed,function()):向上滑动
$(selector).slideToggle(speed,function()):切换
动画:
$(selector).animate({params},speed,function()):当使用 animate() 时,必须使用 Camel 标记法书写所有的属性名,比如,必须使用 paddingLeft 而不是 padding-left,使用 marginRight 而不是 margin-right,等等。同时,色彩动画并不包含在核心 jQuery 库中。与css3动画略有不同的是个人觉得比较好控制,不会回到原来的状态。
可以取相对值:
$("button").click(function(){
$("div").animate({
left:'250px',
height:'+=150px',
width:'+=150px'
});
});
使用预定义值:hide(),show(),toggle()
$("button").click(function(){
$("div").animate({
height:'toggle'
});
});
使用队列:
$("button").click(function(){
var div=$("div");
div.animate({height:'300px',opacity:'0.4'},"slow");
div.animate({width:'300px',opacity:'0.8'},"slow");
div.animate({height:'100px',opacity:'0.4'},"slow");
div.animate({width:'100px',opacity:'0.8'},"slow");
});
停止动画:
stop() 方法适用于所有 jQuery 效果函数,包括滑动、淡入淡出和自定义动画。
jquery笔记(效果)的更多相关文章
- Jquery笔记和ajax笔记
Jquery笔记:jQuery是一个JavaScript函数库,专为事件处理设计 1.jQuery的引入 <script text="type/javascript" src ...
- 前端:jQuery笔记
前端:jQuery笔记 此系列文章乃是学习jQuery的学习笔记. Asp.net MVC Comet推送 摘要: 一.简介 在Asp.net MVC实现的Comet推送的原理很简单. 服务器端:接收 ...
- Python全栈之jQuery笔记
jQuery runnoob网址: http://www.runoob.com/jquery/jquery-tutorial.html jQuery API手册: http://www.runoob. ...
- css3线条围绕跑马+jquery打字机效果
原文地址:css3线条围绕跑马+jquery打字机效果 有图有真相,今天偶然看到了一种效果,仔细看了下,发现它是用css的clip+css3的动画实现的,简直叼.于是自己拿来了前一阵子写的打字机效果, ...
- jquery笔记之属性选择器 查找以某种条件开头的页面元素
jquery笔记之属性选择器 查找以某种条件开头的页面元素 转载:http://www.blogbus.com/amyqiong-logs/78340326.html $("div[id]& ...
- JQuery动画效果
jquery动画效果常用方法 1.show()显示效果语法:show(speed,callback)Number/String,Function speend为动画执行时间,单位为毫秒.也可以为slo ...
- 分享5种风格的 jQuery 分页效果【附代码】
jPaginate 是一款非常精致的分页插件,提供了五种不同风格的分页效果,支持鼠标悬停翻页,快速分页功能.这款插件还提供了丰富的配置选项,你可以根据需要进行设置. 效果演示 源码下载 各个 ...
- 新鲜出炉的30个精美的 jQuery & CSS3 效果【附演示和教程】
新鲜出炉的30个精美的 jQuery & CSS3 效果[附演示和教程] 作为最流行的 JavaScript 开发框架,jQuery 在现在的 Web 开发项目中扮演着重要角色,它简化了 ...
- jquery动画效果---animate()--滚屏
jquery动画效果---animate()方法---W3school
- jquery 之效果
// jquery 之效果 .css()既可以获取值,如 .css('fontSize'), 又可以设置内置属性,既可用驼峰式,也可以用连字符版,如 .css('background-color', ...
随机推荐
- POJ 1830 开关问题 (高斯消元)
题目链接 题意:中文题,和上篇博客POJ 1222是一类题. 题解:如果有解,解的个数便是2^(自由变元个数),因为每个变元都有两种选择. 代码: #include <iostream> ...
- MVC3.0 EF增删改查的封装类
本人亲身使用EF CodeFirst,因为增删改查都是使用EF内置的一些方法,我想把它封装到一个类调用就行了.结合网上的资料和自己的整理,若有不对的地方望斧正,感激不尽.直接上代码吧.我就用新闻的增删 ...
- sql 查询表的所有详细信息
SELECT (case when a.colorder=1 then d.name else '' end) as 表名,--如果表名相同就返回空 a.colorder as 字段序号, a.nam ...
- supersr--addSubview和 insertSubView 区别
A addSubview B 是将B直接覆盖在A的最上层 例子: [self.view addSubview:scrollView]; A insertSubView B AtIndex:2 是将 ...
- 第三章 C#循环与方法
第一节1-For循环入门 语法: for(条件表达式) { 执行语句 } 练习: 第三章作业1.写一个程序打印100到200的值;2.写一个程序从10打印到1:3.写一个程序打印10到30之间的所有偶 ...
- Index on DB2 for z/OS: DB2 for z/OS 的索引
可以创建在任何表上的索引: Unique Index:An index that ensures that the value in a particular column or set of col ...
- wifi display代码 分析
转自:http://blog.csdn.net/lilian0118/article/details/23168531 这一章中我们来看Wifi Display连接过程的建立,包含P2P的部分和RTS ...
- log4net的配置与使用
log4net解决的问题是在.Net下提供一个记录日志的框架,它提供了向多种目标写入的实现,比如利用log4net可以方便地将日志信息记录到文件.控制台.Windows事件日志和数据库(包括MS SQ ...
- Git学习笔记 git revert
我们难免会因为种种原因执行一些错误的commit / push,git提供了revert命令帮助程序员修复这样的错误. 举个例子,下图是git commit 的历史记录 git revert 命令会通 ...
- hibernate中many-to-one关联时出现ObjectNotFoundException异常
采用多对一关联,如果一的那端删除了,多的这端无法感知,虽然数据库中可以通过外键配置将多的一端置空,可是在hibernate里面我暂时不知道如何处理. 目前采用的方式: 1.首先,数据库中需要配置好外键 ...