Ответ 1
var backgroundPos = $(elem).css('backgroundPosition').split(" ");
//now contains an array like ["0%", "50px"]
var xPos = backgroundPos[0],
yPos = backgroundPos[1];
$(elem).css('backgroundPositionY')
делает это на хроме, то есть, и сафари, но не Firefox (или Opera, я считаю). Вы думаете, что jQuery будет иметь polyfill, но это не так, как 1.5. Как я могу легко получить фоновое положение Y, например. фоновая анимация (например, параллакс)?
EDIT: Сообщить Mozilla, что вы хотите background-position-[x,y]
. (используйте функцию "голосовать", а не комментарии, если у вас нет чего-то предсказуемого). Ошибка была открыта с 2010 года (3 года), поэтому не задерживайте дыхание для исправления.:)
var backgroundPos = $(elem).css('backgroundPosition').split(" ");
//now contains an array like ["0%", "50px"]
var xPos = backgroundPos[0],
yPos = backgroundPos[1];
Вот мое хакерское решение:
var $jQueryObject = jQuery('#jQueryObject');
var backgroundPosition = $jQueryObject.css('background-position');
// backgroundPosition = "0% 0%" for example
var displacement = backgroundPosition.split(' '); // ["0%", "0%"]
var y = Number(displacement[1].replace(/[^0-9-]/g, ''));
// As suggested, you could also get the float:
var yFloat = parseFloat(displacement[1].replace(/[^0-9-]/g, ''));
Здесь y
будет числом, которое будет либо процентом, либо смещением пикселя в зависимости от вашей ситуации. Я сделал небольшое регулярное выражение, чтобы избавиться от символов, отличных от числа, чтобы вы могли получить номер в качестве номера javascript.
К сожалению, некоторые браузеры (например, Chrome) сообщают css('background-position')
или css('backgroundPosition')
как left <x> top <y>
, в то время как другие (Internet Explorer, Firefox, Opera) сообщают об этом как <x> <y>
. Для меня работали следующие:
var x, y, pos = $(elem).css('background-position').split(' ');
if(pos[0] === 'left') {
x = pos[1];
y = pos[3];
} else {
x = pos[0];
y = pos[1];
}
Создав ответ seoia mcdowell, вы также можете сделать
var yPos = $(elem).css('backgroundPositionY');