javascript - 为什么 <div> 不移动?

标签 javascript jquery html css

我有一个代码可以移动 <div>从剩下的 94% 到大约剩下 4%,但它似乎不起作用。我认为缺陷出在代码的 CSS 部分,因为控制台没有报告任何错误。

HTML:

<body id="page_body">
    <div class="header_wrap">
        <div class="header_main_title">
            <h1>Text</h1>
        </div>
    </div>
    <div id="scroll" class="scroll_button"></div>
    <div class="container">
        <div class="leftslide"></div>
        <div class="rightslide"></div>
    </div>
</body>

CSS:

div.container {
    /*width: 2960px;*/
    width: 1600px;
    height: 710px;
}

div.leftslide {
    float: left;
    width: 1500px;
    background: url("1.jpg");
    background-repeat: no-repeat;
    height: 790px;
}

div.rightslide {
    position: fixed;
    left: 94%;
    width: 1460px;
    background: url("1.jpg");
    background-repeat: no-repeat;
    height: 790px;
}

JS:

$('#scroll').click(function() {
    $('.rightslide').animate({left: "100%"});
});

JSFIDDLE:http://jsfiddle.net/AFysR/

最佳答案

我不应该被否决。这是一个工作 fiddle :http://jsfiddle.net/NmcZj/

$('#scroll').click(function() {
$('.rightslide').animate({left: "-=100%"});
});

应该可以了。 (区别在于“-=”)

关于javascript - 为什么 <div> 不移动?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18518538/

相关文章:

javascript - 我想在单击提交按钮时始终删除 div 容器?

html - 取html整页

javascript - 如何管理应用程序和 URL 中的状态?

javascript - jQuery $(this).html(text) 在嵌套 div 中不起作用

html - 垂直 MD 工具栏

jquery - 简单的 jQuery 文件上传插件(仅使用 iframe)

jquery - swfupload 不适用于 Flash 10

javascript - 根据属性值删除对象数组中的重复项

javascript - react 传递新 Prop

javascript - 如何将 React 元素附加到 JavaScript 对象的属性