jquery - jquery background positioning of background sprite

Question

On load - am running the following as an animation, CSS background position of a sprite and the appearance of a text block. All is working sans the css.background. Anyone know why jquery appears to be ignoring the css call? Or a suggested work around?

function roll_a() {
$("#a").css("background-position", "0px -444px");
$("#a_text").delay(1000).slideDown();
$("#a").css("background-position", "0px 0px");
$("#a_text").delay(500).slideUp();

$("#b").css("background-position", "0px -216px");
$("#b_text").delay(2000).slideDown();
$("#b").css("background-position", "0px 0px");
$("#b_text").delay(500).slideUp();
}

This however this is working elsewhere, but just on mouseover.

    $("#a").mouseenter(function() {
    $("#a").css("background-position", "0px -444px");
    $("#a_text").slideDown();
    }).mouseleave(function() {
    $("#a").css("background-position", "0px 0px");
    $("#a_text").slideUp();
    });

Answer 1

我相信 jQuery 中的正确语法是：

$("#a").css("backgroundPosition", "0px -444px");

背景位置而不是背景位置

Answer 2

解决。

JQuery 是如此之快....它在瞬间移动了背景位置 - 甚至没有眨眼。通过使用 setTimeout 能够将其减慢到足以显示效果。

$("#a_text").delay(1000).slideDown();
   setTimeout( function(){
   $("#a").css("background-position", "0px -444px");
},1000);

$("#a_text").delay(500).slideUp();
   setTimeout( function(){
   $("#a").css("background-position", "0px 0px");
},2000);