JSFiddle - React, Tailwind, and code Playground
HTML
<div id='banner'>TOP SLIDE BANNER</div>
<button id='down'>열기</button><button id='up'>닫기</button>
CSS
* {
margin:0; padding:0;
}
#banner {
width:100%;
padding:20px;
text-align:center;
background:#ADF3FF;
color:#fff;
font-weight:bold;
font-size:30px;
display:none;
}
JavaScript
$(function() {
$('#banner').slideDown('slow');
$('#up').click(function() {
$('#banner').slideUp('slow');
});
$('#down').click(function() {
$('#banner').slideDown('slow');
});
});