Галерея снимков с эффектом слайд-шоу

[kvg95]

Народ, выручайте.

Задача сделать на странице две независимые навигационные строки из превьюшек снимков. Несколько снимков видны, остальные появляются при наведении (нажатии) курсора на кнопки NEXT или PREV (эффект слайд-шоу). Перемещение по превьюшкам и открывание большого снимка на этой же странице (в отведённом поле) должно происходить без перезагрузки страницы.

Часть работы уже проделана - с обеих навигационных строк большие снимки нормально открываются, независимо друг от друга.

Засада в другом.
Слайд-шоу превьюшек работает на одной из строк, той, чей скрипт объявления находится ниже в коде страницы... Меняешь их местами - работает другой. Может, чего-то элементарного не знаю...?

Исходником взят вот этот скрипт:
http://www.dhtmlgoodies.com/index.html?whichScript=image-slideshow-vertical

http://slil.ru/25924651
Это тот вариант, о котором я говорю.

http://slil.ru/25924660
Здесь другой принцип и другой движок.
На самом деле, я в нём больше заинтересован, чем в первом. Просто кидался от одного варианта к другому.

В итоге - оба варианта у меня в похожей стадии.

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

[Naydav]

А не хочешь использовать галерею как на
http://new.edukation.com.ua/news/fancy.html
Нажми внизу на фото, таких галерей можно делать несколько, и они не будут взаимосвязаны
И это делается за пол-часа, посмотри в гугле плагины jquery - галерея(слайд-шоу)

[kvg95]

Naydav, благодарю.

Но если бы меня интересовал подобный движок, я бы не стал беспокоить уважаемую публику, поверь.

В посте я довольно подробно объяснил суть проблемы, приложил исходники.

У мня проблема в конфликте двух одинаковых функций на одной странице. И я не знаю пока как их грамотно разнести по своим меткам, идентификаторам...

Вот и прошу совета у знающих людей. ;)

[astrologer]

Так и есть - переменные просто перезаписывают предудущие значения.

Во втором примере всё просто - достаточно поменять во втором участке кода идентификаторы на уникальные, например, дописать "_2":
// А именно, здесь:
<dl id="accordionExample_2" class="accordion">
<dd class="accordion_content">
<div id="example_4_2">
<div id="example_4_content_2">

// ... и здесь:
<div id="example_4_frame_2">
<img id="example_4_previous_2" src="menu_files/ex4_prev.gif" alt="move previous" />
<img id="example_4_next_2" src="menu_files/ex4_next.gif" alt="move next" />
</div>Внести для них изменения в стили:
#example_4, #example_4_2 {
position: relative; /* important */
overflow: hidden; /* important */
width: 172px; /* important */
height: 212px; /* important */
background: #000;
}

#example_4_frame, #example_4_frame_2 {position: relative}
#example_4_frame, #example_4_frame_2 img {position: absolute;}
#example_4_previous, #example_4_previous_2 {top: 0; left: 0;}
#example_4_next, #example_4_next_2 {top: 192px; left: 0;}

#example_4_content, #example_4_content_2 {
position: absolute;
margin-top: 20px;
left: 0;
}И запустить конструктор ещё раз, с новыми параметрами: new iCarousel("example_4_content_2", {
idPrevious: "example_4_previous_2",
idNext: "example_4_next_2",
idToggle: "undefined",
item: {
klass: "example_4_item",
size: 86
},
animation: {
direction: "top",
duration: 250,
amount: 2
}
});Самый незатейливый путь.

[kvg95]

astrologer? большое спасибо!

Направление понял, сам засматривался на эти идентификаторы, но, видать, смелости не хватило... ;)

Завтра (т.е. сегодня) с утречка покопаю в этом направлении.

Ещё раз благодарю за совет!
Удачи.

[kvg95]

astrologer, сообщаю результаты.

Осуществлён значительный прорыв!
Правда, с ходу не получилось. Поэтому, покопавшись, разнёс переменные более детально, чем вы предложили.
Добавил еще здесь:
<div class="example_4_item_2">

И в css разнёс в отдельные блоки, для чистоты эксперимента.

Что имеем в итоге?
Обе панели заработали, превьюшки скроллятся, снимки с обеих панелей открываются.

Но возникли два бага, которые я пока не могу проанализировать - по умолчанию снимки в панелях встают с номера 9, хотя, по идее, должны с единицы. Похоже, что это середина списка снимков - при уменьшении кол-ва снимков начальный номер изменяется.

И второй баг - прокручиваются не все снимки в панели - в определённый момент половина снимков пропускается...

http://slil.ru/25929202
Здесь лежит последний вариант, если не напрягаю, глянете?

Ещё раз спасибо.

[astrologer]

Вот хак для IE6:* html .example_4_item img,
* html .example_4_item_2 img
{
margin: 5px 3px;
}В остальных браузерах багов не обнаружил.