Mike Eghtebas
asked on
iQuery animation slide not working
I have 3 buttons each performing simple animations. The last button ( <button id="moveDiv" >Move Div</button>) is not working.
Question: How can I fix the code so that upon click on "Move Div" button, the div will swing to the right?
Thank you,
Mike
===========
Question: How can I fix the code so that upon click on "Move Div" button, the div will swing to the right?
Thank you,
Mike
===========
<!DOCTYPE html>
<html>
<head>
<title>iQuery CSS sizing and positioning</title>
<script type="text/javascript" src="jQuery/jquery-1.3.2.js"></script>
<script type="text/javascript">
//$("document").ready(function() {
$(function() {
$("#growRight").click(function() {
$("#theDiv").animate({width: "500px"},1000);
});
$("#bigText").click(function() {
$("#theDiv").animate({fontSize: "24pt"}, 1000);
});
$("#moveDiv").click(function() {
$("#theDiv").animate({ left: "500" }, 1000, "swing");
});
});
//});
</script>
<style type="text/css">
div#theDiv {
height: 180px;
width: 250px;
margin: 10px;
padding: 20px;
background: Lightblue;
border: 2px solid black;
offset: 250px;
cursor: pointer;
}
p, span {
font-size: 18pt;
}
button {margin: 2px;}
</style>
</head>
<body>
<p>Fading an Element</p>
<div id="theDiv">Animate Me</div>
<button id="growRight" >Grow Right</button>
<button id="bigText" >Big Text</button>
<button id="moveDiv" >Move Div</button>
</body>
</html>
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Good to know it helped. Thanks for the points and grade.
kiranvj
kiranvj
ASKER
position:relative;
}
works.
Thank you.