摘要:<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>jq的切换动画</title> &n
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>jq的切换动画</title>
<script type="text/javascript" src="jquery.js"></script>
<style type="text/css">
div{width: 200px;height: 200px;margin: 0 auto;border: 1px solid black;}
button{display: block;margin: 0 auto;}
</style>
</head>
<body>
<div></div>
<button>点击显示/隐藏</button>
</body>
<script type="text/javascript">
$(document).ready(function(){
$('div').hover(function(){
$(this).css('background','pink');
},function(){
$(this).css('background','#fff');
})
$('button').click(function(){
$('div').toggle();
})
})
</script>
</html>笔记:
hover(over,out)鼠标的移入移出事件
toggle() 如果元素是可见的,就隐藏,否则相反
批改老师:韦小宝批改时间:2019-03-10 13:21:54
老师总结:写的很不错 jQuery实现这些效果比js要简单的多了吧