在公司学习前端之jquery动画加选择器
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js">
</script>
<link rel="stylesheet" type="text/css" href="css/new.css" />
</head>
<body>
<script>
$(document).ready(function(){
$("span").hide();
$("#sli").click(function(){
$("#slia,#slib,#slic").slideToggle("slow");
});
$("button").click(function(){
$("button").hide();
var div=$("div");
div.animate({height:'300px',opacity:'0.4'},"slow");
div.animate({width:'300px',opacity:'0.8'},"slow");
div.animate({height:'100px',opacity:'0.4'},"slow");
div.animate({width:'100px',opacity:'0.8'},"slow");
div.hide(function(){
$("#sli,#slix").show();
});
});
});
</script>
<button class="btn">点我</button>
<div style="background:#FF1493;height:100px;width:100px;position:absolute;">
</div>
<span id="slix" align="center">
<span id="sli">请选择</span><br>
<a href="csz.html"><span id="slia">猜数字</span></a><br>
<a href="jsq.html"><span id="slib">计数器</span></a><br>
<a href="jsq1.html"><span id="slic">计算器</span></a><br>
</span>
</body>
</html>