Imageslider jQuery

大家好(这是我在这里的第一个帖子)

我正在用jquery制作一个“imageslider”(但使用div:s)。 问题是,如何用边框将滚动元素隐藏在div之外?

(我是新来的,所以我不能发带有链接的帖子,所以我删除了它们) 代码:

<script type="text/javascript">

  var pos = 1; 

  $(document).ready(function(){
  console.log("possition: " + pos);

  var slides = $('#container .element');
  var numberOfSlides = slides.length;
  console.log("antal slides: " + numberOfSlides);

  $('#right').click(function(){

   if(pos<=numberOfSlides-1){
      //$('#container div.element').animate({"left" : '+=200px' }, 1000, function() {pos++;});
      $('#container div.element').animate({"left" : '+=200px' }, 1000 );
    pos++;
    console.log("possition: " + pos);
    }

    else{   
    $('#container div.element').animate({"left" : '-=400px' }, 1000);
    pos=1;
    console.log("possition: " + pos);
    }        
  });

  $('#left').click(function(){
   if(pos>1){
       $('#container div.element').animate({"left" : '-=200px' }, 1000);
     pos--;
     console.log("possition: " + pos);  
   }

   else {
    $('#container div.element').animate({"left" : '+=400px' }, 1000);
    pos=3;
    console.log("possition: " + pos);
   }
  });

   }); 
</script>


<div id="container">
    <div id="element1" class="element">3</div>
    <div id="element2" class="element">2</div>
    <div id="element3" class="element">1</div>
</div>

<link id="left" class="slideLink"><</link> 
<link id="right" class="slideLink">></link>