jQuery入门基础(动画效果)
一、隐藏显示
1、show()--显示隐藏的被选择元素
例:$(selector).show(speed,callback);
2、hide()--隐藏被选元素的内容
例:$(selector).hide(speed,callback);
speed:规定元素隐藏、完全可见的速度。默认为 "0"。
可能的值:
- 毫秒 (比如 1500)
- "slow"
- "normal"
- "fast"
callback:show 函数执行完之后,要执行的函数。
二、上下滑动
1、slideup()--滑动上升
例:$(selector).slideUp(speed,callback)
2、slideDown()--滑动下降
例:$(selector).slideDown(speed,callback)
三、淡入淡出
1、fadeIn()--淡入元素
$(selector).fadeIn(speed,callback);
2、fadeOut()--淡出元素
$(selector).fadeOut(speed,callback)
四、自定义动画
animate()-- 执行 CSS 属性集的自定义动画
$(选择器).animate({params},speed,function(){回调函数});
扩展:
(1)$(selector).animate(styles,speed,easing,callback)
规定在不同的动画点中设置动画速度的 easing 函数。
内置的 easing 函数:
- swing
- linear
(2)$(selector).animate(styles,options)
规定动画的额外选项。
可能的值:
- speed - 设置动画的速度
- easing - 规定要使用的 easing 函数
- callback - 规定动画完成之后要执行的函数
- step - 规定动画的每一步完成之后要执行的函数
- queue - 布尔值。指示是否在效果队列中放置动画。如果为 false,则动画将立即开始
- specialEasing - 来自 styles 参数的一个或多个 CSS 属性的映射,以及它们的对应 easing 函数
(3)动画停止
stop()--停止动画
$(selector).stop(stopAll,goToEnd)
stopAll--规定是否停止被选元素的所有加入队列的动画。
goToEnd--规定是否允许完成当前的动画。
jQuery入门基础(动画效果)的更多相关文章
- Jquery如何使用动画效果改变背景色
Jquery如何使用动画效果改变背景色 一.问题引入 jquery的animate动画虽然强大,但是无法使用其进行背景色(background-color)的动画效果变化,因为animate动画效果只 ...
- jQuery基础---动画效果
内容摘要: 1.显示.隐藏 2.滑动.卷动 3.淡入.淡出 4.自定义动画 5.列队动画方法 6.动画相关方法 7.动画全局属性 发文不易,转载请注明出处~ 一.显示.隐藏 jQuery 中显示方法 ...
- JQuery图片切换动画效果
由于博主我懒,所以页面画的比较粗糙,但是没关系,因为我主要讲的是如何实现图片动画切换. 思路:想必大家都逛过淘宝或者其他的一些网站,一般都会有图片动画切换的效果,那是怎样实现的呢?博主我呢,技术不是很 ...
- jQuery之简单动画效果
1. show()显示动画 语法:show(speed,callback) Number/String,Function speend为动画执行时间,单位为毫秒.也可以为slow",&quo ...
- JQuery(二)——简单动画效果
上一篇博客总结了JQuery的一些基本知识,这篇博客重点从JQuery能够制造各种各样的网页效果方面来进行总结.总结一些常见的常用的基本效果的必备方法.从隐藏显示,淡入淡出,滑动,动画等几个方面来简单 ...
- jQuery的事件,动画效果等
一.事件 click(function(){}) 点击事件 hover(function(){}) 悬浮事件,这是jQuery封装的,js没有不能绑定事件 focus(function(){}) ...
- python 之 前端开发( jQuery事件、动画效果、.each()、 .data())
11.58 事件 11.581 事件绑定方法与解绑 绑定事件: // 绑定方式一: $('.box1').click(function () { alert('绑定方式一') }); // 绑定方 ...
- [学习笔记]jQuery实现一些动画效果的方法
jQuery实现效果的方法 1,隐藏和显示:hide(),show(),toggle() // [ˈtɑ:gl]切换 语法: $(selector).hide(speed,callback); $( ...
- 关于jquery自带动画效果的stop()问题
首先先来看一下jquery中stop()的用法 stop()用于在动画执行前停止正在执行的动画 stop(stopAll,goToEnd)的两个参数为布尔值: stopAll:true/false:是 ...
随机推荐
- Alpha冲刺10
前言 队名:拖鞋旅游队 组长博客:https://www.cnblogs.com/Sulumer/p/10045588.html 作业博客:https://edu.cnblogs.com/campus ...
- 使用jsoup轻松爬数据
刚刚学习爬虫,感觉使用jsoup爬虫挺容易的.记录一下自己爬取数据的过程. Jsoup介绍: Jsoup 是一个 Java 的开源HTML解析器,可直接解析某个URL地址.HTML文本内容.使用Jso ...
- FCC JS基础算法题(11):Seek and Destroy (摧毁数组)
题目描述: 实现一个摧毁(destroyer)函数,第一个参数是待摧毁的数组,其余的参数是待摧毁的值. 我们可以使用arguments来进行参数的遍历. function destroyer(arr) ...
- ubuntu16.04下python2、python3环境选择与python升级(pip版本切换)
参考链接:https://www.jianshu.com/p/63c1f22e1fed Ubuntu中python版本问题: 添加PPA: sudo add-apt-repository ppa:jo ...
- Linux安装软件出现 “Unable to locate package xxx”错误
使用新购入的阿里云服务器ECS,预装的Ubuntu,然后想要利用 xrdp 进行远程登陆,但是在输入命令: apt-get install xrdp 出现了 E;Unable to locate pa ...
- linux 怎么上传下载-- 文件
https://www.cnblogs.com/lynn-li/p/6078595.html yum install lrzsz rz:从本地上传文件至服务器 sz filename:从服务器下载文件 ...
- js中的Call()和apply()
Call和apply,就是改变函数里面的this指向的方法. xxx.call()或xxx.apply() 特别强调下xxx必须是function,(普通函数,类,构造函数) var obj={ na ...
- 无旋treap
#ifndef FHQTREAP_H_INCLUDED #define FHQTREAP_H_INCLUDED //author Eterna #define Hello The_Cruel_Worl ...
- 使用deb 打包开发的postgres extension
昨天写过一个使用rpm 打包分发pg 扩展的demo,今天使用deb 进行打包分发,同时使用checkinstall 生成我们的deb包 安装deb 依赖 sudo apt-get install c ...
- Java高级特性 第6节 注解初识
一.注解概述 Java注解也就是Annotation,是Java代码里的特殊标记,它为Java程序代码提供了一种形式化的方法,用来表达额外的某些信息,这些信息是代码本身无法表示的. 注解以标签的形式存 ...