jquery將點擊列表項目移動到列表輪播中的第一個可見項目

嘿，我有一個列表項目的旋轉木馬，我想能夠做的是當用戶點擊列表項目時（比如第四個可見項目列表）被點擊的項目向左滾動並結束於第一個可見位置。jquery將點擊列表項目移動到列表輪播中的第一個可見項目

哦，我使用jCarousel插件使旋轉木馬工作。

我有一個鏈接：

link

真的不知道如何甚至開始，任何想法？

謝謝！

來源

2011-02-02 d8nieldonaldson

這裏是我的旋轉木馬，這可能有助於（它有點擊的事件和動畫）：

<html> 
    <head> 
     <title></title> 
     <style type="text/css"> 
      #wrapper { width: 300px; overflow: hidden; height: 100px; min-height: 100px; position: relative; margin: 0; padding: 0; } 
      #ul { width: 9999px; height: 100px; position: absolute; margin: 0 auto; padding: 0; text-align: center; } 
      .li { float: left; list-style-type: none; position: relative; margin: 0 auto; padding: 0; } 
     </style> 
     <script type="text/javascript" src="http://code.jquery.com/jquery-1.4.3.min.js"></script> 
     <script type="text/javascript"> 
      $(document).ready(function() { 

       for (var i = 24; i > 0; i--) { 
        $('#ul').append('<li class="li" style="z-index: '+i+'"><img src="http://www.jamesgraygallery.com/artimages/Mee%20Kyung%20Shim/slides/Last%20Summer,50x50.jpg" alt="'+i+'" width="100" height="100"</li>'); 
       } 

       $('#ul').css({ //Reset the carousel to the center 
        'left': -($('.li').size()*$('.li').width())/2 
       }); 

       var howMany = $('.li').size(); 
       var halfIt = howMany/2; 
       var merp = $('.li').index('#ul'); 

       $('#right').click(function() { //Right button 
        $('#ul').animate({ 
         left: '-='+($('.li').width()*3) //Move the images 
        }, 500); 
        return false; 
       }); 

       $('#left').click(function() { //Left button 
        $('#ul').animate({ 
         left: '+='+($('.li').width()*3) //Move the images 
        }, 500); 
        return false; 
       }); 

      }); 
     </script> 
    </head> 
    <body> 
     <div id="wrapper"> 
      <ul id="ul"> 

      </ul><br /> 
     </div> 
     <a href="#" id="right">right</a>&nbsp;&nbsp;<a href="#" id="left">left</a> 
    </body> 
</html>

這應該是一個好地方，讓你開始。^_^

note：這不會給你所需的CLICK-TO-ANIMATE功能，但是我不能爲你做到這一切嗎？ :)

來源

2011-02-02 16:05:43

jquery將點擊列表項目移動到列表輪播中的第一個可見項目

回答

相關問題