0

我的水平滚动有问题。当我在 chrome 中检查时，我没有看到错误。你能告诉我问题出在哪里，因为我找不到吗？

<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>

4

2 回答 2

2

您指的是marginRight哪个不是您的页面中定义的变量。

代替

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

经过

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

从文档中：

动画属性也可以是相对的。如果为值提供了前导 += 或 -= 字符序列，则通过从属性的当前值中加上或减去给定数字来计算目标值。

如果我猜到你的意图，还有另一个逻辑问题：你不能在左右边距的情况下这样玩。请参阅演示以了解可行的方法。

于 2012-10-06T17:59:41.490 回答
0

未来的JSFiddle请：http: //jsfiddle.net/ryanwheale/P7HvH/

此外，您不能像现在这样添加字符串：

marginLeft +"200px"

首先添加整数...然后附加字符串后缀：

(marginLeft + 200) + "px";

此外，您的示例没有定义marginLeft变量。将此添加到顶部：

var marginLeft = 10;
于 2012-10-06T18:04:49.697 回答