Moving between two pixels

by Mehran Khakban

HTML

<table style="width: 384px; background-color: #abc; display:block; overflow-x:hidden; float: right; position: absolute; top: 75px; right: 65px;" align="right"  cellpadding="0" cellspacing="0px">
        <img src="http://icons.iconarchive.com/icons/visualpharm/must-have/32/Next-icon.png" id="right" style="cursor:pointer; position: absolute; top: 130px; right: 24px;" class="right"/>
    
   <p style="position:static"><tr id="box" style="color: GrayText; position:static; " class="display"></p>
       
   <p style="position:relative"><td style="width: 50px" valign="top" align="right"></p>
   <p style="position:relative"><img src="http://icons.iconarchive.com/icons/ph03nyx/super-mario/64/Racoon-Mario-icon.png" /></p></td>

   <p style="position:relative"><td style="width: 50px" valign="top" align="center"></p>
   <p style="position:relative"><img src="http://icons.iconarchive.com/icons/ph03nyx/super-mario/64/Racoon-Mario-icon.png" /></a></p></td>
    
    <p style="position:relative"><td style="width: 50px" valign="top" align="center"></p>
    <p style="position:relative"><img src="http://icons.iconarchive.com/icons/ph03nyx/super-mario/64/Racoon-Mario-icon.png" /></a></p></td>

</tr> 
    <img src="http://icons.iconarchive.com/icons/visualpharm/must-have/32/Previous-icon.png" id="left" style="cursor:pointer; position: absolute; top: 130px; right: 505px;" class="left"/>
</table>

JavaScript

$(".right").click(function () {
   $("p").animate({right: "-=64px"});
});
$(".left").click(function(){
   $("p").animate({right: "+=64"});
});