JavaScript-每次单击元素时的Offset div

Question

我一直在努力解决一个令人沮丧的简单问题。 每次单击按钮时，我都需要一个div来向右移动更多。

<div class="gallery">
  //Gallery content here 
</div>
<div class="arrow-m-left"  onClick="moveLeft()">
        //Button to move the gallery left by 590px each time this is clicked.
</div>
<div class="arrow-m-right" onClick="moveRight()">
        //Button to move the gallery right by 590px each time this is clicked.
</div>

Answer 1

您可以借助jquery .animate（）来实现 。

这是例子

参考在这里

的HTML

<button id="left">&laquo;</button>
<button id="right">&raquo;</button>
<div class="block"></div>

的CSS

div {
    position: absolute;
    background-color: #abc;
    left: 50px;
    width: 90px;
    height: 90px;
    margin: 5px;
  }

JS

$( "#right" ).click(function() {
  $( ".block" ).animate({ "left": "+=50px" }, "slow" );
});

$( "#left" ).click(function(){
  $( ".block" ).animate({ "left": "-=50px" }, "slow" );
});

您可以根据需要更改left的值。 希望这可以帮助。