jquery动画基础
- 根据id改变字体大小的动画
<div class="speech">样式切换</div>
<div id="switcher">
<button id="switcher-large">click me</button>
</div>var $speech=$("div.speech");
var defaultSize=$speech.css("fontSize");
$("#switcher button").click(function(){
//alert("123")
var num=parseFloat($speech.css("fontSize"),10);
//alert(num); //弹出默认字体大小16
switch(this.id){
case 'switcher-large':
num *= 1.4;
break;
case 'switcher-small':
num /= 1.4;
break;
default:
num=parseFloat(defaultSize,10); }
$speech.animate({fontSize:num+"px"},"slow")
}) - 淡入淡出
$("p").hide();
$("a").click(function(){
$("p").animate({
opacity:'toggle', //淡入淡出的效果
height:'toggle' //由上到下的显示效果
},"slow");
})
jquery动画基础的更多相关文章
- 三、jQuery--jQuery基础--jQuery基础课程--第7章 jQuery 动画特效
1.调用show()和hide()方法显示和隐藏元素 show()和hide()方法用于显示或隐藏页面中的元素,它的调用格式分别为:$(selector).hide(speed,[callback]) ...
- jquery动画,基础以及我发现的新大陆
$.animate()在jquery官方介绍有2中方式,其实我发现的新大陆也是第二种方式的扩展! 一.$.animate( properties [, duration ] [, easing ] [ ...
- jQuery动画特效实例教程
本文以实例形式详细讲述了jQuery动画特效的实现方法. 1.自制折叠内容块 内容块如下: <div class="module"> <div cla ...
- jQuery官方基础教程笔记(转载)
本文转载于阮一峰的博文,内容基础,结构清晰,是jquery入门不可多得的资料,非常好,赞一个. 阮一峰:jQuery官方基础教程笔记 jQuery是目前使用最广泛的javascript函数库. 据统计 ...
- jQuery动画使用总结
jQuery动画我用的比较多的仅仅只有show和hide,但是作为一个被我们大多数人所熟知的框架,相信他的动画功能还是比较多样的,这里做个小总结. 1.jQuery animate(),用于创建自定义 ...
- jQuery 动画效果 与 动画队列
基础效果 .hide([duration ] [,easing ] [,complete ]) 用于隐藏元素,没有参数的时候等同于直接设置 display 属性 $('.target').hide() ...
- 【学习笔记】jQuery的基础学习
[学习笔记]jQuery的基础学习 新建 模板 小书匠 什么是jQuery对象? jQuery 对象就是通过jQuery包装DOM对象后产生的对象.jQuery 对象是 jQuery 独有的. 如果 ...
- jQuery动画的实现
没有引入deferred机制,其余流程都有了 //////////// //创建动画缓动对象 // //////////// function Tween(value, prop, animation ...
- 深入学习jQuery动画控制
× 目录 [1]动画状态 [2]停止动画 [3]动画延迟[4]全局控制 前面的话 jQuery动画可以使用fade.hide.slide等方法实现基本动画效果,可以使用animate实现自定义动画,甚 ...
随机推荐
- SQL2005 数据库——查看索引
sqlserver查询表索引 2012-09-19 18:18 by Spring.Guo, 4599 阅读, 0 评论, 收藏, 编辑 SELECT 索引名称=a.name ,表名=c.nam ...
- Java maven安装GDAL
1. 使用编译好的安装jdal http://www.gisinternals.com/release.phpgdal-111-1800-x64-core.msi下载地址:http://downloa ...
- RDIFramework.NET ━ 9.15 个性化设置 ━ Web部分
RDIFramework.NET ━ .NET快速信息化系统开发框架 9.15 个性化设置 -Web部分 个性化设置,主要针对用户的偏好对界面进行设置,主界面如下: 9.15.1界面皮肤设置 目前框 ...
- 51CTO专访淘宝清无:漫谈Nginx服务器与Lua语言
http://os.51cto.com/art/201112/307610.htm 说到Web服务器,也许你第一时间会想到Apache,也许你会想到Nginx.虽然说Apache依然是Web服务器的老 ...
- Ubuntu文件操作命令
1.工具栏放下面或者左边的命令 gsettings set com.canonical.Unity.Launcher launcher-position Left gsettings set com. ...
- zjuoj 3605 Find the Marble
http://acm.zju.edu.cn/onlinejudge/showProblem.do?problemCode=3605 Find the Marble Time Limit: 2 Seco ...
- STL之优先队列(1)
优先队列用法 在优先队列中,优先级高的元素先出队列. 标准库默认使用元素类型的<操作符来确定它们之间的优先级关系. 优先队列的第一种用法: 也是最常用的用法 priority_queue< ...
- sql 遍历结果集
declare @temp table ( [id] int IDENTITY(1,1), [Name] varchar(10) ) --select * from @temp declare @te ...
- Android之ViewHolder用法
http://www.cnblogs.com/mengdd/p/3254323.html (zhuan) http://blog.csdn.net/mrzhang_happy/article/deta ...
- paper 98:图像视觉各个领域文献目录
当前图像视觉各个领域文献资料的索引,包含计算机视觉.图像处理.文本(图像)分析.视频分析.模式识别等主题.如果对哪个方向比较感兴趣,可以查看这个方向的比较重要的Paper,每一个大的目录后面都对应一些 ...