javascriptまたはjqueryは、指定された要素のバックグラウンド位置のプロパティを取得し、次に動的に+/-を取得します。

Question

私はロールオーバを設定したい要素をいくつか持っています。時間の経過とともに各ロールオーバーのたびに手動で位置を設定するよりも多くの時間がかかるでしょう。現在、私はスプライトを使用しています。時間が増えるにつれ、それに多くのものが追加されます。常にサイドバイサイドであり、常にイメージの各側面につき10pxのパディングがあります。

私のdefualtの位置が常に0 100の場合は、私は知っていると私は50の100になることを知っているロールオーバーを取得したいどのように私は2つの値そのうちの1つに追加するだけです

Answer 1

バックグラウンド位置をつかんで2つの値に分割し、計算を実行して値を文字列として戻す必要があります。あなたはその後、整数にそれらを有効にする必要があり

myPos = $('.selection').css("background-position").split(" ") 

myPos[0] <-- will contain the X-value, "50px" 
myPos[1] <-- will contain the Y-value, "100px" 

例えば

：次に

myPos[0] = parseInt(myPos[0].replace("px","")) 

あなたが数学を行う（[1]あなたがmyPosと同じことをやっていると仮定）と割り当てそれらバック：

myPos[0] = myPos[0] + 100 

$('.selection').css("background-position", myPos[0]+'px ' + myPos[1] + 'px')