Обновление позиции с изменением ширина окна браузера
 

Здравствуйте! Делаю свой JQuery слайдер, который должен работать во всю ширину блока, но при изменении самой ширины не могу добиться плавной смены позиции контейнера со слайдами (проблема видна в Chrome, в IE 11 работает на ура).
Сейчас поясню.
Есть html-код:

<div class="slides">
	<div class="slider-container">
		<figure>....</figure>
		<figure>....</figure>
	</div>
</div>

При нажатии кнопок влево/вправо slider-container меняет свою позицию (влево на +ширина .slides или влево на -ширина .slides), т.е. что-то по типу киноленты получается.
Для фиксирования изменения ширины окна браузера, я использую следующую обработку:

$(window).bind('resize', function() {
	pred = $(block).innerWidth();
	$(item).width(pred);
	$(cont).css({left: (-1)*pred*acs + 'px'});
}).trigger('resize');

Где $block - .slides, $item - figure, acs - индекс активного слайда, $cont - slider-container, pred - ширина .slides
И вот при смене ширины окна браузера, позиция $cont заметно меняется.
Как сделать плавную замену позиции? Можно, конечно, использовать вместо позиции left - translateX, но хочется, чтобы работало и для IE 8.

Заранее спасибо!

П.С. во вложениях не совсем доработанный "прототип".

Плавность, выходит за счёт того, что у слайдов всегда есть соседи, т.е. нужно клонировать первый и последний элемент и расставить их противоположно (если уже нужна циклическая прокрутка).

Проблема решена.