摘要：第一部分是笔记部分。========================== jQuery 动画效果：隐藏/显示 =====================1.hide( [speed] , [view] , [function] ) ——隐藏显示的元素 speed:隐藏过程的速度。是一个英文毫秒值 vies：切换的效果值，默认swling（慢慢显示的效果） //一般情况下不用这个参数 functio
第一部分是笔记部分。
========================== jQuery 动画效果：隐藏/显示 =====================
1.hide( [speed] , [view] , [function] ) ——隐藏显示的元素
speed:隐藏过程的速度。是一个英文毫秒值
vies：切换的效果值，默认swling（慢慢显示的效果） //一般情况下不用这个参数
function：在动画完成时执行的一个函数
2.show( [] [] [] )——显示隐藏的元素
========================== jQuery 动画效果：滑动slide =====================
jQuery的滑动式通过高度的变化（向某个方向增大或减小）来动态显示所匹配的元素
1. slideDown( [speed] [fun] ) ——向下增大，下滑效果【展开】
2. slideUp( [speed] [fun] ) ——向上减小，上滑效果【收起】
3.slideToggle( [speed] [fun] ) ——通过高度的变化来实现是否可见
speed可以是slow / fast / 毫秒
========================== jQuery 动画效果：淡入淡出fade =====================
原理：控制不透明度的变化
1.fadeIn ( [speed] [fun] ) ——淡入
2.fadeOut( [speed] [fun] ) ——淡出
3.fadeToggle( [speed] [fun] ) ——淡入淡出
4.fadeTo( [speed] 【opacity】 [fun] ) ——将不透明度以渐进方式调整到指定的不透明度
opacity 在0～1
======================== jQuery 动画效果：动画的自定义与停止====================
1.创建自定义动画 animate（）
语法： $ (selector) . animate ( {params}, speed, fn);
params: 定义形成动画的CSS属性， 这个大括号里面不要写；多属性之间用，隔开
params也可以使用预定义的值 show hide toggle
animate中的一些
fontSize
left//右移
2.停止动画或效果 stop（）
在它们完成以前，该方法适用于所有jQuery效果函数，包括滑动、淡入淡出和自定义动画。
语法： $(selector).stop(stopAll, goToEnd)
stopAll可选，默认false仅删除当前活动…….true则 可以清除整个队列
goToEnd可选，是否立即完成当前动画。默认false，如果是true，则立刻完成当前动画效果。
默认情况下stop会清楚在被选元素上指定的当前动画。
3.
默认中的html元素都是固定的，想要移动需要添加语句 Position:absolute
第二部分是我完成的关于自定义动画和停止的测试和实践
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>JQ基础语法</title>
<script type="text/javascript" src="jquery-3.3.1.min.js"></script>
<style type="text/css">
div{width: 200px; height: 200px; background: blue;position:absolute;}
</style>
</head>
<body>
<script type="text/javascript">
$(document).ready(function(){
$('.but1').click(function(){
$('p').animate({fontSize:'40px'}, 1500);
})
$('.but2').click(function(){
$('div').animate({left:'200px',},3000);
$('div').animate({fontSize:'30px'},3000);
})
$('#stop').click(function(){
$('div').stop(true,true);
})
})
</script>
<button>点击字体放大</button>
<p>jQuery中我们使用animate创建自定义的动画</p>
<button id = 'move'>点击移动div</button>
<button id = 'stop'>停止</button>
<div>你好呀！</div>
</body>
</html>
批改老师：查无此人批改时间：2019-04-03 17:38:00
老师总结：完成的不错，看来你学了不少jq的方法。继续加油。
