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() 为toggle(),就像点击一样,除了接受多个函数参数.

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

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