響應縮略圖轉盤

我這裏有一個的jsfiddle - http://jsfiddle.net/ZrHfu/1/響應縮略圖轉盤

演示在這裏 - http://www.ttmt.org.uk/forum/thumb_test/

我試圖創建一個負責任的縮略圖旋轉木馬 - 我見過的插件來做到這一點但它們都需要圖像相同的尺寸，我需要有不同尺寸圖片的東西。

這是非常基本的 - 圖像左側浮動列表，溢出：隱藏在容器上。

我有左/右按鈕，當按鈕被點擊時，我正在嘗試將圖片左右移動。

只連接右側按鈕。

我的問題是它只能使用一次。

如果你點擊右鍵，圖像向左移動，再次點擊它並沒有任何反應。

它爲什麼只能工作一次。

<!DOCTYPE html> 
    <html> 
     <meta charset="UTF-8"> 
     <title>Title of the document</title> 
     <meta name="description" content=""> 
     <meta name="keywords" content=""> 
     <meta name="robots" content=""> 

     <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" /> 

     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script> 

     <link rel="stylesheet" href="css/master.css" /> 

     </head> 

    <body> 


     <a class="arrow left">&larr;</a> 

     <div class="thumbs"> 

      <ul> 

      <li><a href="#"><img alt="" src="images/01.jpg" /></a></li> 
      <li><a href="#"><img alt="" src="images/02.jpg" /></a></li> 
      <li><a href="#"><img alt="" src="images/03.jpg" /></a></li> 
      <li><a href="#"><img alt="" src="images/04.jpg" /></a></li> 
      <li><a href="#"><img alt="" src="images/05.jpg" /></a></li> 
      <li><a href="#"><img alt="" src="images/06.jpg" /></a></li> 
      <li><a href="#"><img alt="" src="images/07.jpg" /></a></li> 
      <li><a href="#"><img alt="" src="images/08.jpg" /></a></li> 
      <li><a href="#"><img alt="" src="images/09.jpg" /></a></li> 
      <li><a href="#"><img alt="" src="images/10.jpg" /></a></li> 
      <li><a href="#"><img alt="" src="images/11.jpg" /></a></li> 
      <li><a href="#"><img alt="" src="images/12.jpg" /></a></li> 
      <li><a href="#"><img alt="" src="images/13.jpg" /></a></li> 
      <li><a href="#"><img alt="" src="images/14.jpg" /></a></li> 
      <li><a href="#"><img alt="" src="images/15.jpg" /></a></li> 

      </ul> 
     </div> 

     <a class="arrow right">&rarr;</a> 


     <script src="js/hel.js"></script> 

    </body> 

    </html>

來源

2013-04-30 ttmt

如果單擊右鍵，圖像向左移動，因爲你申請的.thumbs類的div的寬度留給ul元素。第二次嘗試將已設置爲左側的相同寬度應用於元素ul。所以這就是爲什麼沒有發生。

解決方案： 你需要找回左值ul元素並將它添加到.thumbs類的寬度和應用價值animate功能。

我更新了代碼以進一步移動。看一看：http://jsfiddle.net/ZrHfu/2/

來源

2013-04-30 15:11:17 Unknown

歡迎我親愛的朋友:) – Unknown 2013-04-30 16:11:14

響應縮略圖轉盤

回答

相關問題