Показать сообщение отдельно
  #1 (permalink)  
Старый 05.12.2011, 14:44
Новичок на форуме
Отправить личное сообщение для Budyaga Посмотреть профиль Найти все сообщения от Budyaga
 
Регистрация: 05.12.2011
Сообщений: 2

Проблемы с animate и backgroundPosition
http://demo.en.cx/GameDetails.aspx?gid=15736 - блок "От автора игры" с параллакс-скроллингом.

$(function(){
	$('head').append('<link href="http://d2.endata.cx/data/games/15736/prison.css" type="text/css" rel="stylesheet" />');
	enter = false;
	var skof = $('#skof');
	var link = $('#link');
	var fon = $('#fon');
	var opis = $('#opis');
	opis.live('mousemove', function(e) {
		var offset = opis.offset();
		var curX = (e.pageX - offset.left);
		var smar = 70-Math.round(curX/11);
		var t = 20*Math.abs(parseInt(skof.css('marginLeft'))-smar);
		if (t==0 || enter==true) {
			enter = true;
			skof.css('marginLeft', smar);
			link.css('marginLeft', 319-smar);
			fon.css('backgroundPosition', (smar*(-1.4)));
		}
		else { 
			skof.stop(true).animate({
				marginLeft: smar
			}, t);
			link.stop(true).animate({
				marginLeft: 319-smar
			}, t);
			fon.stop(true).animate({
				backgroundPosition: smar*(-1.4)
			}, t);
		}
	}).live('mouseleave', function() {
		enter = false;
		var smar = skof.css('marginLeft');
		var t = parseInt(smar)*20;
		skof.stop(true).animate({
			marginLeft: 0
		}, t);
		link.stop(true).animate({
			marginLeft: 319
		}, t);	
		fon.stop(true).animate({
			backgroundPosition: 0
		}, t);
	}).live('mouseenter', function() {
		skof.stop(true);
		link.stop(true);
		fon.stop(true);
	});
})


В ИЕ8 при событии mouseleave анимация:
fon.stop(true).animate({
	backgroundPosition: 0
}, t);

выполняется мгновенно, в то время как остальные двигающиеся части:
skof.stop(true).animate({
	marginLeft: 0
	}, t);
link.stop(true).animate({
	marginLeft: 319
}, t);

Выполняются за время равное t
Ответить с цитированием