Question

大家好（这是我的第一个帖子）

我正在使用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>

Answer 1

最简单的方法是使用这样的现有插件：

http://www.gmarwaha.com/jquery/jcarousellite/

否则您尝试将样式添加到容器div

#container { overflow:hidden; }

图像滑块jQuery

1 个答案: