Jquery - 第一次单击时更改背景位置，第二次重置

Question

晚上好！我有半个脚本需要在单击时更改元素的CSS背景位置 - 这样可以正常工作。但是我需要CSS在第二次点击时将背景位置重置为0 0;

非常感谢！

$(document).ready(function(){
$('#login-btn').click(function(){
                $('#login-btn').css('backgroundPosition', '0px -39px');
                 }, function(){
                $('$login-btn').css('backgroundPosition', '0px 0px');

             });
            });

Answer 1

我将CSS放在一个类中，然后使用.toggleClass()。

示例： http://jsfiddle.net/xwnKP/

$('#login-btn').click(function(){
    $(this).toggleClass('clicked');
});

CSS

#login-btn {
    background-position: 0 0;
}
#login-btn.clicked {
    background-position: 0 -39px;
}

如果你想按照你的方式去做，你需要改变click() to toggle()，这就像点击一样，除了接受多个函数参数。

示例： http://jsfiddle.net/xwnKP/1/

$('#login-btn').toggle(function() {
        $(this).css('backgroundPosition', '0px -39px');
    }, function() {
        $(this).css('backgroundPosition', '0px 0px');
});