水平滾動jquery

我的水平滾動有問題。當我用鉻進行檢查時，我沒有看到錯誤。你能告訴我問題在哪裏，因爲我找不到它？水平滾動jquery

<html> 
    <head> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script> 

    <script> 
     $('#right-button').click(function() { 
     $('#content').animate({ 
     marginRight: marginRight -"200px" 
     }, "fast"); 
     }); 
     $('#left-button').click(function() { 
     $('#content').animate({ 
     marginLeft: marginLeft +"200px" 
     }, "fast"); 
     }); 
    </script> 
    <style type="text/css"> 
     #browser { 
      float: left; 
      width: 300px; 
      overflow: hidden; 
      white-space: nowrap; 
     } 
    </style> 
     
</head> 
<body> 
    <div id="browser"> 
     <a href="#" id="left-button">BACK</a> 
     <div id="content"> 
      This is the content of the text which should be scrolled. 
     </div> 
     <a href="#" id="right-button">NEXT</a> 
    </div> 
     
</body>

來源

2012-10-06 user1107922

你指的marginRight這是不是在你的頁面中定義的變量。

替換

$('#content').animate({ 
    marginRight: marginRight -"200px"

通過

$('#content').animate({ 
    marginRight: "-=200"

從the documentation：

動畫屬性也可以是相對的。如果一個值與供給主導+ =或 - =字符序列，則該目標值是通過添加或從屬性的當前值減去給定數量計算的。

如果我猜你的意圖，還有另一個邏輯問題：你不能像左右邊距這樣玩這個。查看Demonstration以查看可以工作的內容。

來源

2012-10-06 17:59:41

改變，但仍然無法正常工作 – user1107922

還有一個（邏輯）的問題。看[示範]（http://jsfiddle.net/9hubz/）。 –

謝謝！有用！ – user1107922

一個的jsfiddle在未來請： http://jsfiddle.net/ryanwheale/P7HvH/

此外，像你正在做的，你不能添加字符串：

marginLeft +"200px"

第一添加整數......然後附加串成後綴：

(marginLeft + 200) + "px";

此外，您的示例沒有定義marginLeft變量。此添加到頂部：

var marginLeft = 10;

來源

2012-10-06 18:04:49

對不起，我的jsfiddle現在是uptodate。對於那個很抱歉。我的工作示例改變了一些事情，以顯示它的工作。我想你可以從那裏得到它。 –

水平滾動jquery

回答

相關問題