Animation

JQuery Animation

by Rikin Patel

HTML

<script src="https://getfirebug.com/firebug-lite-debug.js"></script>
<div style="height: 40px;">
        <div id="divTestBox4" style="height: 20px; width: 20px; background-color: #89BC38; position: absolute;"></div>
</div>

JavaScript

$(function () {

	//$("#divTestBox4").animate({ "left" : "20px" }, 500);
	//$("#divTestBox4").animate({ "left" : "50px" }, 500);
});

$(document).ready(function () {

	animateImg(0, 350, 0, 2000);

});

var animateImg = function (left, right, i, time) {
console.log(left + ' ' + right +' '+ i)
if(left == right)	
{return;}

	$("#divTestBox4").animate({
		"left" : right + "px"
	}, time,
		function () {
		var tmp = left;
		left = right;
        right = tmp;
        
        if(i==0)
        {
            right += 25;
            i = 1;
        }
        else
        {
            right -= 25;
            i=0;
        }
       
        time += 10;
		animateImg(left, right, i, time);
	}
	
			
	);

};