0

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?

2
Contributors
2
Replies
3
Views
5 Years
Discussion Span
Last Post by Thevenin
0

Should this not work?

var right = $('#rectone').offset().right;
$("#rectone").css({right:right}).animate({"right":"0px"}, "slow");
This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.