Create hide/show sliding panel in HTML page using Javascript, Jqurey
<!DOCTYPE html>
<html>
<head>
<title>MicroSoft ASP Solutions | Javascript</title>
<meta charset="utf-8" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
$("#flip").click(function () {
$("#panel").slideToggle("slow");
});
});
</script>
<style type="text/css">
#panel, #flip {
padding: 5px;
text-align: center;
background-color: white;
border: solid 1px #c3c3c3;
color:Red;
cursor:pointer;
}
#panel {
padding: 50px;
display: none;
}
</style>
</head>
<body>
<div id="flip">Click to slide the panel down or up</div>
<div id="panel"><a href="https://microsoftaspsolutions.blogspot.com/" target="_blank">Microsoft ASP Solutions</a> <p>This Script Use to Head Tag [script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"]</p></div>
</body>
</html>
thanku so much for sharing such a wonderful information with us
ReplyDeletemost welcome #mycommerceinfo thnakq u soo much for cmnt
Delete