jQuery动画效果之滑入滑出slideDown,slideUp
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head> <title>滑入滑出</title> <meta charset="UTF-8"> <style type="text/css"> #slideshow,#slidehide,#slidetoggle,#slidetoggle,.content{ text-align: center; padding: 5px; background-color: #1ecc86; color:black; border: 1px solid red; } .content{ display: none; padding: 50px; } </style></head><body><script src="jquery-3.4.1.js"></script><script> $(document).ready(function () { $(‘#slidehide‘).click(function () { $(‘.content‘).slideUp(1000) }); $(‘#slideshow‘).click(function () { $(‘.content‘).slideDown(1000) }); $(‘#slidetoggle‘).click(function () { $(‘.content‘).toggle(1000); }) })</script><div id="slideshow">出现</div><div id="slidehide">隐藏</div><div id="slidetoggle">Toggle</div><div class="content">hello star♥</div></body></html>
相关推荐
tztzyzyz 2020-07-05
87281248 2020-07-04
EdwardSiCong 2020-11-23
85477104 2020-11-17
hhanbj 2020-11-17
81427005 2020-11-11
seoppt 2020-09-13
honeyth 2020-09-13
WRITEFORSHARE 2020-09-13
84483065 2020-09-11
momode 2020-09-11
85477104 2020-08-15
83510998 2020-08-08
82550495 2020-08-03
tthappyer 2020-08-03
84901334 2020-07-28
tthappyer 2020-07-25
TONIYH 2020-07-22
tztzyzyz 2020-07-20