javascript或jquery获取给定元素的背景位置属性，然后+/-动态获取 [英] javascript or jquery get background-position properties of a given element and then +/- to that dynamically

问题描述

我有几个元素我想设置滚动，我是如何在飞行中进行计算，而不是手动设置每次滚动的位置，因为随着时间的推移会有很多。目前我正在使用一个精灵，随着时间的推移我越来越多。总是并列，总是以10px的方式填补每个图像的各个方面。

所以我知道如果我的defualt位置总是0 100，我想要滚动，那么我知道它将是50 100我该怎么做只是有一个方法来取2个值那只是添加到其中一个

解决方案

你需要抓住背景位置并将其分解成两个值，执行计算，将值设置为字符串。

例如

  myPos = $（'。selection'）。css（background-position）。split（）
 
 myPos [0]<  - 将包含X值， 50px
 myPos [1]<  - 将包含Y值，100px
  

然后你需要将它们变成整数：（假设你和myPos [1]一样）

  myPos [0] = parseInt（myPos [0] .replace（px，））
  

然后你做数学并分配他们：

  myPos [0] = myPos [0] + 100 
 
 $（'。selection'）。css（background-position，myPos [0] +'px'+ myPos [1] +'px'）
  pre> 
I have a handful of elements I want to set roll overs on, how ever I am looking to do the calculating on the fly rather than manually setting the position each time for each roll over as over time there will be many. Currently I am using a sprite, that as the time comes I append more to it.. Always side by side, and always 10px padding all around for the per image aspect of it.

So I know if my defualt position is always 0 100 for example and I want to get the roll over for that then I know its going to be 50 100 How can I go about just having a method of taking the 2 values of that but only adding to one of them
解决方案
You need to grab the background-position and break it into two values, perform the calculation, that set the values back as a string.

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

myPos[0] <-- will contain the X-value, "50px"
myPos[1] <-- will contain the Y-value, "100px"
You then need to turn them into integers: (assume you're doing the same with myPos[1])
myPos[0] = parseInt(myPos[0].replace("px",""))
Then you do the math and assign them back:
myPos[0] = myPos[0] + 100

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


                        
这篇关于javascript或jquery获取给定元素的背景位置属性，然后+/-动态获取的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！