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实现自定义动画,甚 ...
随机推荐
- Git push 常见用法
Git push 在使用git commit命令将修改从暂存区提交到本地版本库后,只剩下最后一步将本地版本库的分支推送到远程服务器上对应的分支了,如果不清楚版本库的构成,可以查看我的另一篇,g ...
- java 8 新特性
最近在IDEA的️驱使下,看了点java8的东西,链接贴一下,,,,, 1.Java 8新特性概述2.Java 8中的 Stream API 详解[3.Java 8新特性终极指南] 简单的使用看完新特 ...
- Silverlight TreeView 动态绑定Xml 文件
随着应用程序的不断升级,客户的需求不断增多,程序员不得不对自己的应用程序做出相应的修改,如果修改的内容较多,那么就必须找出一种简便方法,下面就为大家介绍一下在SilverLight 中左边导航栏T ...
- sql server 中删除表中数据truncate和delete的区别(转载自.net学习网)
我们都知道truncate table可以用来删除整个表的内容,它与delete后面不跟where条件的效果是一样.但除此之外,我们还清楚它们之间有其它的区别吗?本章我们将一起讨论truncate与d ...
- Centos 安装 Java
建立文件夹 进入/usr/文件夹下,建立一个文件,我这里是java文件夹,将jdk-8u45-linux-x64.tar.gz复制到/usr/java文件夹下 解压文件 解压指令为:tar -zxvf ...
- Python 函数式编程 & Python中的高阶函数map reduce filter 和sorted
1. 函数式编程 1)概念 函数式编程是一种编程模型,他将计算机运算看做是数学中函数的计算,并且避免了状态以及变量的概念.wiki 我们知道,对象是面向对象的第一型,那么函数式编程也是一样,函数是函数 ...
- JSP知识体系大全
Jsp动态网页 Web页面之间有3种关系: 包含 请求转发 重定向 l Jsp的运行原理:(3个) Jsp页面不能直接运行 1.容器调用jsp引擎编译jsp文件 成一个java文本(Servle ...
- paper 108:系统学习数字图像处理之图像复原与重建
首先,必须注意这里所限制的处理条件. 关于图像退化/复原模型 退化的图像是由成像系统的退化加上额外的噪声形成的. 1.只考虑噪声引起的退化 噪声模型,包含于空间不相关和相关两种,除了空间周期噪声,这里 ...
- 17. 星际争霸之php设计模式--职责链模式
题记==============================================================================本php设计模式专辑来源于博客(jymo ...
- 爬虫6:多页面增量Java爬虫-sina主页
之前写过很多单页面python爬虫,感觉python还是很好用的,这里用java总结一个多页面的爬虫,迭代爬取种子页面的所有链接的页面,全部保存在tmp路径下. 1 序言 实现这个爬虫需要两个数据结构 ...