Mon Dec 31, 2012 12:28 am
<html>
<head>
<title>Slide Down animation</title>
<!--
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js">
</script>
Note you can download the JQuery package instead of using Google version. -->
<script src="jquery-1.8.3.js"></script>
<script>
$(document).ready(function(){
$("#div2").click(function(){
$("#div1").slideDown(4000);
});
$("#div1").click(function(){
$("#div3").slideDown(4000);
});
$("#stop").click(function(){
$("#div1").stop();
});
});
</script>
<style type="text/css">
#divWrap{
width:100px;
height:400px;
background-color:#15fe11;
border:solid 1px #1214c3;
}
#div1,#div2,#div3
{
padding:5px;
text-align:center;
border:solid 1px #c3c3c3;
}
#div1,#div3
{
padding:20px;
display:none;
}
</style>
</head>
<body>
<div id="divWrap">
<div id="div2"><a href="#">Show Hidden</a></div>
<div id="div1"><a href="#">Link1</a></div>
<div id="div3"><a href="#">Link2</a></div>
</div>
<button class="stop">Stop Div1</button>
</body>
</html>
Codemiles.com is a participant in the Amazon Services LLC Associates Program, an affiliate advertising program designed to provide a means for sites to earn advertising fees by advertising and linking to Amazon.com
Powered by phpBB © phpBB Group.