Не работает анимация Background Position в IE7-8

[SCHNITZER]

Привет!

Взял вот отсюда идею анимацию фона при наведении мыши.

http://snook.ca/technical/jquery-bg/

Написал подобную историю: http://html-test.1gb.ru/003_AnimateBackgro...tion/index.html

Но мой тест не работает в IE7-8 (6 я твердо решил не поддерживать).

В чем может быть дело?

[psywalker]

Да такую хрень с плавной заменой позиции фона у блока тебе Great Rash напишет на чистом JS закрытыми глазами за 1-2-е минуты максимум. При этом он одной рукой будет висеть на турнике, а писать второй.)

[SCHNITZER]

Great Rash, в студию!!! ))

не понятно, почему в примере http://snook.ca/technical/jquery-bg/ работает, хоть с этим бы разобраться...

[Great Rash]

Внезапно появляюсь Я...

psywalker конечно ОЧЕНЬ сильно приукрасил мои возможности.

Вот тут я писал туториал на тему... может ознакомитесь? http://forum.htmlbook.ru/index.php?showtopic=20782

UPD: Ааа... все понял... невнимательно прочитал пост.

Ошибка происходит в функции toArray

 function toArray(strg) {
				strg = strg.replace(/left|top/g, '0px');
				strg = strg.replace(/right|bottom/g, '100%');
				strg = strg.replace(/([0-9\.]+)(\s|\)|$)/g, "$1px$2");
				var res = strg.match(/(-?[0-9\.]+)(px|\%|em|pt)\s(-?[0-9\.]+)(px|\%|em|pt)/);
				return [parseFloat(res[1], 10), res[2], parseFloat(res[3], 10), res[4]];
			}

strg в ИЕ undefined

[SCHNITZER]

Вопрос решил.

Необходимо подключить jquery-1.2.6.min.js., или работать не будет.

[Great Rash]

У jQuery нет обратной совместимости? Печально...

[SCHNITZER]

Похоже, этот плагин криво написан. Скачал другой, с последним jQurey работает нормально.

/**
* @author Alexander Farkas
* v. 1.21
*/


(function ($) {
	if (!document.defaultView || !document.defaultView.getComputedStyle) { // IE6-IE8
		var oldCurCSS = jQuery.curCSS;
		jQuery.curCSS = function (elem, name, force) {
			if (name === 'background-position') {
				name = 'backgroundPosition';
			}
			if (name !== 'backgroundPosition' || !elem.currentStyle || elem.currentStyle[name]) {
				return oldCurCSS.apply(this, arguments);
			}
			var style = elem.style;
			if (!force && style && style[name]) {
				return style[name];
			}
			return oldCurCSS(elem, 'backgroundPositionX', force) + ' ' + oldCurCSS(elem, 'backgroundPositionY', force);
		};
	}

	var oldAnim = $.fn.animate;
	$.fn.animate = function (prop) {
		if ('background-position' in prop) {
			prop.backgroundPosition = prop['background-position'];
			delete prop['background-position'];
		}
		if ('backgroundPosition' in prop) {
			prop.backgroundPosition = '(' + prop.backgroundPosition;
		}
		return oldAnim.apply(this, arguments);
	};

	function toArray(strg) {
		strg = strg.replace(/left|top/g, '0px');
		strg = strg.replace(/right|bottom/g, '100%');
		strg = strg.replace(/([0-9\.]+)(\s|\)|$)/g, "$1px$2");
		var res = strg.match(/(-?[0-9\.]+)(px|\%|em|pt)\s(-?[0-9\.]+)(px|\%|em|pt)/);
		return [parseFloat(res[1], 10), res[2], parseFloat(res[3], 10), res[4]];
	}

	$.fx.step.backgroundPosition = function (fx) {
		if (!fx.bgPosReady) {
			var start = $.curCSS(fx.elem, 'backgroundPosition');

			if (!start) {//FF2 no inline-style fallback
				start = '0px 0px';
			}

			start = toArray(start);

			fx.start = [start[0], start[2]];

			var end = toArray(fx.options.curAnim.backgroundPosition);
			fx.end = [end[0], end[2]];

			fx.unit = [end[1], end[3]];
			fx.bgPosReady = true;
		}
		//return;
		var nowPosX = [];
		nowPosX[0] = ((fx.end[0] - fx.start[0]) * fx.pos) + fx.start[0] + fx.unit[0];
		nowPosX[1] = ((fx.end[1] - fx.start[1]) * fx.pos) + fx.start[1] + fx.unit[1];
		fx.elem.style.backgroundPosition = nowPosX[0] + ' ' + nowPosX[1];

	};
})(jQuery);

[psywalker]

psywalker конечно ОЧЕНЬ сильно приукрасил мои возможности.

Да, прости, про турник - это я загнул