Javascript-форум - Помогите с применением кода!

Javascript-форум (https://javascript.ru/forum/)

- Events/DOM/Window (https://javascript.ru/forum/events/)

- - Помогите с применением кода! (https://javascript.ru/forum/events/25789-pomogite-s-primeneniem-koda.html)

Помогите с применением кода!

Здравствуйте, прошу у Вас помощи, так как уже довольно долго мучаюсь и ничего не выходит.
Вообщем нашёл в Интернете скрипт для плавной смены одной картинки на другую... Для одной картинки (точнее места) он всё хорошо работает, но у меня никак не получается поставить рядом допустим, ещё одну так же изменяющуюся картинку, оно либо переходит в то же место где первая (и оказывается под ней как бы) либо вообще не работает. Помогите пожалуйста! Вот код:

...
<link href="../menu/style.css" rel="stylesheet" type="text/css" />
<style type="text/css">
div#rotator div { position:absolute;}
</style>

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>

<script type="text/javascript">
function theRotator() {
$('div#rotator div').css({opacity: 0.0});
$('div#rotator div:first').css({opacity: 1.0});
setInterval('rotate()',2000);
}

function rotate() {
var current = ($('div#rotator div.show')? $('div#rotator div.show') : $('div#rotator div:first'));
var next = ((current.next().length) ? ((current.next().hasClass('show')) ? $('div#rotator div:first') :current.next()) : $('div#rotator div:first'));
next.css({opacity: 0.0})
.addClass('show')
.animate({opacity: 1.0}, 1000);
current.animate({opacity: 0.0}, 1000)
.removeClass('show');
};

$(document).ready(function() {
theRotator();
});
</script>

</head>

<body>

<div id="rotator">
<div class="show"><img src="img/1.jpg" width="200" height="300" style="border:1px solid #CCC"/></div>
<div> <img src="img/2.jpg" width="200" height="300" style="border:1px solid #CCC"/> </div>
</div>
...

По идее, я чтобы рядом расположить ещё картинку, я просто тупо ставлю ещё такой же див, только с другим картинками... но ничего не выходит, он переходит на место первой картинки...

Прошу сильно не ругаться, в js я не разбираюсь! А попросить помощи больше не знаю где!

Пожалуйста, отформатируйте свой код!

Для этого его можно заключить в специальные теги: js/css/html и т.п., например:

[js]
... ваш код...
[/js]

О том, как вставить в сообщение исполняемый javascript и html-код, а также о дополнительных возможностях форматирования - читайте http://javascript.ru/formatting.

Прошу прощения! Вот вроде исправил!

div#rotator div { position:absolute;}

function theRotator() {
$('div#rotator div').css({opacity: 0.0});
$('div#rotator div:first').css({opacity: 1.0});
setInterval('rotate()',2000);
}

function rotate() { 
var current = ($('div#rotator div.show')? $('div#rotator div.show') : $('div#rotator div:first'));
var next = ((current.next().length) ? ((current.next().hasClass('show')) ? $('div#rotator div:first') :current.next()) : $('div#rotator div:first')); 
next.css({opacity: 0.0})
.addClass('show')
.animate({opacity: 1.0}, 1000);
current.animate({opacity: 0.0}, 1000)
.removeClass('show');
};

$(document).ready(function() { 
theRotator();
});

<div id="rotator">
<div class="show"><img src="img/1.jpg" width="200" height="300" style="border:1px solid #CCC"/></div>
<div> <img src="img/2.jpg" width="200" height="300" style="border:1px solid #CCC"/> </div>
</div>