单击后如何使按钮改变位置？

Question

如何按下这个demo here之后按钮更改其位置，而不是活动参数，我希望它在margin-left:50px;点击之后明确地点击

HTML

<div class="button">
    <button type="fb-like">Fb-Like</button>
</div>

CSS

.button:active {
    margin-left:50px;
}
/* But with a on clicked parameter instead of active */

Answer 1

这是一个简单的解决方案：

http://jsfiddle.net/LJHQW/2/

JavaScript：

/* Toggles the style class on click */

$("button").click(function() {
    $(".button").toggleClass("buttonLeft");
});

CSS：

.buttonLeft {margin-left:50px;} /* But with a on clicked parameter instead of active */

Answer 2

您需要使用JavaScript：

var d = document.getElementById("button");
d.addEventListener('click',function(){
    d.className = d.className + " move";
});

演示：http://jsfiddle.net/LJHQW/3/

或者，如果你已经使用jQuery：

$('.button').click(function(){
    $(this).addClass('move');
});

演示：http://jsfiddle.net/LJHQW/1/