JSFiddle - React, Tailwind, and code Playground
by hannes
HTML
<div id="slider">
<ul id="frisherVertical">
<li>Fresher Academy</li>
<li><a href="#">About us</a></li>
<li><a href="#">Our Offerings</a></li>
<li><a href="#">Latest Event</a></li>
<li><a href="#">Contact us</a></li>
</ul>
</div>
<div class="footer1">
<div class="footer2">
<p id = "copyright">All rights are reserved © 2014 | <a href="#" id = "pri_pol">Privacy Policy</a></p>
</div>
<div class="slide_menu">
<img src="../imgs/up_arrow.png" id="slideArrow"/>
</div>
</div>
CSS
.footer1 {
background-color:#FFB919;
}
.footer2 {
background-color:#298CB5;
}
#slider {
display:none;
padding: 5px;
}
#copyright {
text-align:center;
font-family:Arial, Helvetica, sans-serif;
font-size:10px;
color:#FFF;
}
JavaScript
$(document).ready(function(){
$(".footer1").click(function(){
$("#slider").slideToggle("slow");
});
});