jQuery Forum

i am trying to animate an image with jquery but running into issues.

first, I want the image to be initially hidden;
second, I want it to slide to the left from the right side of the screen; from its initial placement of 700px outside of the screen.

my code works on firefox.
my code doesnt work as expected on IE and Chrome.

questions:
1. how can i get rid of the bottom scroll bar in firefox?
2. why the fadeIn line doesnt get executed?
3. how can i make it work consistently in all browsers?

here is the link to my page and bellow is my code:

<script type="text/javascript">
$("#picture").find(function() {
    $("img:hidden:first").fadeIn("slow");
});

$("#picture").find(function() {
    $("#picture").animate({"left": "-=700px"}, "slow");
});
</script>


<style type="text/css">
#picture { position:absolute; top:0px; right:-700px; display:block;  }
.hide { display:none; }
</style>
 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<img src="/i/idximg.jpg" id="picture" class="hide" alt="" />