Response title
This is preview!
animate event
in Getting Started
•
10 years ago
hello i have a problem
i have 2 divs 1 is displayed and the other isn't
if i click the displayed the undisplayed one appears and then both should start moving
but only the div which was displayed first moves. if you dont get what im meaning tryout this code and you will see what's wrong. i hope someone can help me with this.
here is the code:
<html>
<head>
<style type="text/css">
div.movable
{
background-color:rgba(0,255,0,0.7);
width:200px;
position:relative;
border:solid 1px #cccccc;
}
div.movable#spoiler
{
display:none;
width:200px;
overflow:hidden;
border:solid 1px #cccccc;
}
</style>
<!-- here starts the jquery part-->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js "></script>
<script type="text/javascript">
$(document).ready(function(){
$("div.movable").click(function(){
$("div.movable#spoiler").slideToggle("1300");
$(this).animate({left:"100px"},"1300");
$(this).animate({width:"500px"},"1300");
});
});
</script>
</head>
<body>
<div class="movable"> click here and see what happens </div>
<div class="movable" id="spoiler">hi,this is some random text <br /> 11111111111111111111111111111111111111111111111111
11111111111111111111111111111111111111111111111111</div>
</body>
</html>
1
