JQuery: анимировать позицию элемента и непрозрачность toghether

Question

У меня есть DIV элемент со стилем CSS:

.somediv { 
    display: block; 
    width: 100px; 
    height: 100px; 
    background: #4679BD; 
    position: absolute; 
    top: 10px; 
    left: 100px; 
    opacity: 0; 
} 

и я хочу, чтобы изменить положение верхом DIV с JQuery анимации. Также в этом процессе анимации мне нужно изменить непрозрачность.

Я пытался сделать это с помощью этого сценария JQuery:

$('.somediv').animate({ 
    'top':'150px', 
    'opacity':'1' 
}, 1000); 

Это работает, как мне нужно в Firefox, но в Chrome положение анимация не работает. Div изменяет позицию сразу после завершения анимации.

P.S: Если я изменяю position:relative, то это хорошо работает в обоих браузерах, но мне нужно сделать это с position:absolute;

Как это исправить?

Вот скрипка. Попробуйте в обоих браузерах, и вы увидите разницу: http://jsfiddle.net/eJXLf/

.

----- UPDATE -----

Вот как это выглядит в Chrome и Firefox:

Chrome: ........... .................................... Факс:

..... ................................

Answer 1

Это сложно проверить, потому что я не могу воспроизвести его в своей версии chrome, но вместо этого вы можете попробовать использовать marginTop?

$('.somediv').animate({ 
    marginTop: '150px', 
    opacity: 1 
}, 1000); 

Answer 2

Работает отлично в Chrome 32.0.1700.76 для меня. Положение и непрозрачность плавно улучшаются.

Answer 3

Похоже, это ошибка Chrome.

Я использовал Chrome 33.0.1750.46 бета-м, но когда я тестировал в версии 34.0.1812.0 он работает нормально.

Спасибо за ответы.