Hi all I'm trying to have some jQuery movement on my HTML page.
I have a div that I want to move from right to left, and another one from left to right.
This is what I did:
#rectone {
background: #0000FF;
height: 10px;
width: 100px;
float:right;
position: absolute;
top: 0;
right: 0;
margin-top:5%;
}
#recttwo {
background: #00FF00;
height: 10px;
width: 100px;
float:left;
position: absolute;
top: 0;
left: 0;
margin-top:7%;
}
<script type="text/javascript">
$(document).ready(function(){
$(".run").click(function(){
var left = $('#rectone').offset().left;
$("#rectone").css({left:left}).animate({"left":"0px"}, "slow");
});
});
</script>
<body>
<p><a href="#" class="run">Run</a></p>
<div id="rectone"></div>
</body>
This is the right to left movement, but I can't figure out how to move the other box from left to right.
Some hints?