Изменение идентификатора div в jQuery ⇐ Jquery

[Anonymous]

Я уже вернулся, и google-fu мне ничего не дал.

Я пытаюсь создать что-то вроде галереи изображений, и мне нужно динамически сбросить элементы div на моем слайдере, но мне не повезло, вот процесс:

• нажмите «влево».
• левый элемент div перемещается вперед.
• идентификатор центрального элемента divs получает называется «левым» и наоборот (используется временный идентификатор, чтобы остановить два элемента div с одинаковым идентификатором).
• CSS сбрасывается, как будто этого никогда не происходило, за исключением того, что изображение отличается.

Моя проблема в том, что они, похоже, полностью сбрасываются в исходное состояние, как будто изменения идентификатора никогда не происходило, есть идеи?

Вот JSFiddle

и вот код нарушения:

$('.navigationLeft').click(function() {
console.log("yay");
$( '#left' ).animate({
marginLeft: selWidth
}, 500, "linear", function() {
// Animation complete.
$( '#center' ).attr('id', 'temp');
$( '#left' ).attr('id', 'center');
$( '#center' ).attr('id', 'left');
$( '#left' ).css('width', '900px');
$( '#left' ).css('height', '400px');
$( '#left' ).css('overflow', 'hidden');
$( '#left' ).css('position', 'relative');
$( '#left' ).css('left:', '-900px');
$( '#left' ).css('overflow', 'hidden');
$( '#left' ).css('z-index', '2');
$( '#center' ).css('width', '900');
$( '#center' ).css('height', '400');
$( '#center' ).css('position', 'absolute');
$( '#center' ).css('overflow', 'hidden');
$( '#center' ).css('z-index', '1');
});
//reset positions and change images
});


Подробнее здесь: https://stackoverflow.com/questions/222 ... -in-jquery