jq中的自定义事件

原创 2018-11-14 20:15:05 344
摘要:<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>jq自定义停止事件</title> <!-- 引入jq --> <script src=".
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>jq自定义停止事件</title>
		<!-- 引入jq -->
		<script src="../jquery-3.3.1.min.js" type="text/javascript" charset="utf-8"></script>
		<style type="text/css">
			div{
				background: #999;
				width:100px;
				height:100px;
			}
		</style>
	</head>
	<body>
		<div class="box">点击停止按钮</div>
		<input type="button" onclick="Drow()" value="开始">
		<input type="button" onclick="Stop()" value="停止当前">
		<input type="button" onclick="AllStop()" value="停止所有">
		<!-- js -->
		<script type="text/javascript">
			// 动画开始的时候
			function Drow(){
				$('.box').animate({
					'width':'500px',
					'font-size':'30px'
				},1500)
				
				$('.box').animate({'height':'200px'},1500)
				
			}
			
			// 动画停止
			function Stop(){
				//第一个参数 true 表示停止停止所有的动画效果,false表示停止当前动画,下面的动画可以继续执行
				//后面加个true参数表示快速执行
				$('.box').stop(false,true)
			}
			
			// 停止所有
			function AllStop(){
				$('.box').stop(true)
			}
			
		</script>
	</body>
</html>


批改老师:韦小宝批改时间:2018-11-15 09:08:30
老师总结:嗯!不错!代码很完整!写的也很规范!缺少总结!下次记得带上哦!!

发布手记

热门词条