0

私は大きなスプライト画像を持っていますが、この画像を背景として30番のliの背景に設定しました。バックグラウンドを設定した後、ホバーしている間、y位置を70pxマイナスしたいので、オーバーbgに到達します。

なぜなら、これは現在のx、yを取得し、yiから保存して、ホバー位置を達成するために70pxを減らすだけですが、正しく取得されていません。それは動作しますが、それは非常にバグがあります、誰かが私のコードをより良く動作するように修正できますか?

私のコード:

$('.logo-gal li').each(function(index){ // dynamically i am setting the bg, works.
        index % 5 == 0 ? y+=1 : y;
        $(this).css({
            background:'url(images/css/gall-logo.png) no-repeat',
            backgroundPosition: -((index%5) * 106)+'px '+ -(y*140) +'px'
        })

    })

    $('.logo-gal li').hover(function(){
        var backPos = $(this).css('backgroundPosition').split(" ");
        var xPos = parseInt(backPos[0]),yPos = parseInt(backPos[1]);//storing x y pos.
        console.log(xPos);
        $(this).css({backgroundPosition: xPos+ (yPos-70)+"px"});// applying too.. not work, and i need to setback the stored dada, while mouseout..
    })

何か良い提案はありますか?

4

1 に答える 1

1

文字列のカンカテーションに問題がありました

$('.logo-gal li').each(function(index){ // dynamically i am setting the bg, works.
        index % 5 == 0 ? y+=1 : y;
        $(this).css({
            background:'url(images/css/gall-logo.png) no-repeat',
            backgroundPosition: '-'+eval((index%5) * 106)+'px  -'+eval(y*140) +'px'
        })

    })

    $('.logo-gal li').hover(function(){
        var backPos = $(this).css('backgroundPosition').split(" ");
        var xPos = parseInt(backPos[0]),yPos = parseInt(backPos[1]);//storing x y pos.
        console.log(xPos);
        $(this).css({backgroundPosition: eval(xPos+ yPos)+"px"});// applying too.. not work, and i need to setback the stored dada, while mouseout..
    })
于 2012-05-26T10:34:41.283 に答える