动画
高级函数:基于底层函数又进行了封装
两大块:简化版的动画函数和万能动画函数
简化版动画函数
显示/隐藏$().show;  $(...).hide();
  强调:无参数的show()/hide()使用的是display属性
 瞬间隐藏和显示
 动画参数:speed:
 2种:1.三档: fast normal slow  慢中快 
            2.用毫秒数自定义
动画的速度变化:参数:easing:linear线性变化 swing摇摆属性先加速后减速

伸缩/折叠slideUp向上   slideDown向下  slideTogger()切换

淡入/淡出:fadeIn()淡进   fadeOut()淡出   fadeToggle();

 <!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<h1>jQuery动画函数-显示隐藏动画</h1>
<button id="bt1">隐藏DIV</button>
<!--div#target>p>lorem+Tab键-->
<div id="target">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium autem dicta doloribus eius fugit illum
ipsum, itaque laborum laudantium modi necessitatibus, nulla, numquam odio qui quisquam sequi temporibus tenetur
veniam?</p>
</div>
<script src="javascript/jquery-1.11.3.js"></script>
<script>
//为id为bt1的按钮绑定单击事件:
$("#bt1").click(function(){
$("#target").fadeToggle(500);
//toggle切换隐藏/显示效果
});
//让id为target的div隐藏
</script>
</body>
</html>

jQuery-淡入淡出效果-fadeIn()淡进 fadeOut()淡出 fadeToggle();的更多相关文章

  1. 原生JS实现淡入淡出效果(fadeIn/fadeOut/fadeTo)

    淡入淡出效果,在日常项目中经常用到,可惜原生JS没有类似的方法,而有时小的页面并不值得引入一个jQuery库,所以就自己写了一个,已封装, 有用得着的朋友, 可以直接使用. 代码中另附有一个设置元素透 ...

  2. JQuery显示,隐藏和淡入淡出效果

    为了把JQuery搞熟悉,看着菜鸟教程,一个一个例子打,边看边记,算是一晚上的一个小总结吧.加油,我很本但是我很勤奋啊.系统的了解它,就要花时间咯. <!DOCTYPE html> < ...

  3. jQuery学习四——效果

    1.显示,隐藏: <!DOCTYPE html> <html> <head> <title>jquery事件</title> </he ...

  4. Jquery小例子:全选按钮、加事件、挂事件;parent()语法;slideToggle()语法;animate()语法;元素的淡入淡出效果:fadeIn() 、fadeOut()、fadeToggle() 、fadeTo();function(e):e包括事件源和时间数据;append() 方法

    function(e): 事件包括事件源和事件数据,事件源是指是谁触发的这个事件,谁就是事件源(div,按钮,span都可以是事件源),时间数据是指比如点击鼠标的事件中,事件数据就是指点击鼠标的左建或 ...

  5. jQuery练手:仿新浪微博图片文字列表淡进淡出上下滚动效果

    1.效果及功能说明 仿新浪微博图片文字列表上下淡进淡出间歇上下滚动 2.实现原理 首先要设定div内只能显示4个图片那么多出来的图片会自动隐藏然后在给图片添加一个动画的事件让他们可以滚动的播放出来上下 ...

  6. jQuery 学习02——效果:隐藏/显示、淡入淡出、滑动、动画、停止动画、Callback、链

    jQuery 效果- 隐藏hide()和显示show() 语法: $(selector).hide(speed,callback);$(selector).show(speed,callback); ...

  7. jQuery淡入淡出效果轮播图

    用JavaScript做了平滑切换的焦点轮播图之后,用jQuery写了个简单的淡入淡出的轮播图,代码没有做优化,html结构稍微有一些调整,图片部分用ul替换了之前用的div. html结构如下: & ...

  8. 基于jquery实现的文字淡入淡出效果

    这篇文章介绍了jquery实现的文字淡入淡出效果实例,有需要的朋友可以参考一下 复制代码代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1 ...

  9. jQuery效果-----fadeIn()、fadeOut()、fadeToggle()、fadeTo()

    fadeIn(),fadeOut(),fadeToggle(),fadeTo() fadeIn()-----淡入已经隐藏的元素(把隐藏的被选元素渐渐显示出来). 语法:$(selector).fade ...

随机推荐

  1. spark application提交应用的两种方式

    bin/spark-submit --help ... ... --deploy-mode DEPLOY_MODE   Whether to launch the driver program loc ...

  2. deepin中idea中文乱码解决

    打开终端 命令: sudo su 输入密码: aptitude search uming 显示: root@terwer-PC:/home/terwer# aptitude search uming ...

  3. iOS 通知名的通用定义方法

    开发当中用到通知,通知的定义必须要有一个字符串标识通知的名字.一般可以直接写一个字符串,在通知创建和监听的时候直接写这个字符串. 但这样做非常不好,随手创建写代码当时很舒服,但是后来维护的时候发现通知 ...

  4. ArcGIS API for JavaScript

    以3.14版本为例: 1.部署环境: 下载:https://developers.arcgis.com/downloads/apis-and-sdks?product=javascript# 部署:h ...

  5. Flink – Stream Task执行过程

    Task.run if (invokable instanceof StatefulTask) { StatefulTask op = (StatefulTask) invokable; op.set ...

  6. 玩具装箱&土地购买

    今天一天8h 写了两道斜率优化的题(别问我效率为什么这么低 代码bug太多了) 关键是思考的不周全 估计是写的题少手生 以后就会熟练起来了吧. 这道题显然有一个n^2的dp方程 设f[i]表示前i件物 ...

  7. 4QC(四象限变流器)

    1.什么是4QC? 4QC又叫四象限整流器 它是全控型晶闸管的整流电路,现在一般用水冷的IGBT组成的整流电路,它可以调节电压和电流,所谓的四象限就是 u+,i+,为第一象限: u-,i+.,为第二象 ...

  8. ELKstack5.6.5

    ELKstack 安装: 一:环境准备: 1.给添加块磁盘50G,相当于模拟raid 2.分别给它们做本机的主机解析 [root@node01 ~ ]#cat  /etc/hosts 127.0.0. ...

  9. 解决采集知乎数据时由于账号被封遗漏的账号重爬问题(python代码)

    '''一.最笨的办法了################################################################为了处理由于账号被封而没跑到的问题id进行以下两步 ...

  10. es的timeout机制

    GET /_search?timeout=10ms默认情况下,es的timeout机制是关闭的.比如,如果你的搜索特别慢,每个shard都要花好几分钟才能查询出来所有的数据,那么你的搜索请求也会等待好 ...