Nothing happens with animation?

Please have a look at my code below. It's not working and I don't know why!? It's a slider/rotator with a long row of small images that I want to move to the left with an interval of 3 sec.

<script type="text/javascript">

    $(document).ready(function(){

        var imageWidth = 50;
        var imageSum = $(".minislider-content img").size();
        var imageSliderContent = imageWidth * imageSum;
        var number = 1;

        var play = setInterval(function() {
        var imageSliderPosition = number 开发者_如何学JAVA* imageWidth;

        $("minislider-content").animate({
            left: -imageSliderPosition
         }, 250);
         number ++;
         }, 3000);
    });

</script>

The animation is now working, the last image from the right just show up and is not coming from the right. Each image is 50px and the animation area is 320px wide and the total amount of images are 35. When I remove the overflow:hidden then there are several rows of images instead of one long row of all images? What colud be wrong?

---

$("minislider-content")
you're missing an id or class selector $('#minislider-content') or $('.minislider-content')