powered by simpleCommunicator - 2.0.61     © 2026 Programmizd 02
Целевая тема:
Создать новую тему:
Автор:
Закрыть
Цитировать
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Господа, помогите пожалуйста!!!
7 сообщений из 7, страница 1 из 1
Господа, помогите пожалуйста!!!
    #39047661
puzjob
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Гость
Уважаемые посетители, помогите решить проблему:
имеется код:
<div id="gallery">
<table id="table" border="0">
<tr><td valign="top">
<img src="./img/catalog/host/1/1.jpg" alt="" id="main-img1" />
</td>
<td align="center" valign="top">
<ul>
<li><img src="./img/catalog/host/1/thumb/1.jpg" alt="" width="100" /></li>
<li><img src="./img/catalog/host/1/thumb/2.jpg" alt="" width="100" /></li>
<li><img src="./img/catalog/host/1/thumb/3.jpg" alt="" width="100" /></li>
</ul>
</td>
</tr>
</table>
</div>

и скрипт для него:

<script type="text/JavaScript">
// prepare the form when the DOM is ready
$(document).ready(function() {
$("#gallery li img").hover(function(){
$('#main-img2').attr('src',$(this).attr('src').replace('thu mb/', ''));
});
var imgSwap = [];
$("#gallery li img").each(function(){
imgUrl = this.src.replace('thumb/', '');
imgSwap.push(imgUrl);
});
$(imgSwap).preload();
});
$.fn.preload = function() {
this.each(function(){
$('<img/>')[0].src = this;
});
}
</script>


Проблема в следующем: Что бы разместить 2 блока с меняющимися картинками необходимо id заменить class, но в таком случае последняя замененная картинка с class="main-img2" появляется во втором блоке. Как сделать 2 таких блока рядом и чтобы они yt зависели друг от друга? Можно конечно для каждого из блоков присвоить свой id, но таких блоков будет много и не хотелось бы раздувать код сайта.

В общем как доработать скрипт чтобы можно было разместить много подобных блоков с одним классом?
...
Рейтинг: 0 / 0
Господа, помогите пожалуйста!!!
    #39047693
kunaksergey
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Гость
puzjob,
ну классов у вас скажем честно нет.
Да и не понятно, что вам надо сделать-то.
(Правильно заданный вопрос-половина правильного ответа)
...
Рейтинг: 0 / 0
Господа, помогите пожалуйста!!!
    #39047722
puzjob
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Гость
все верно, сейчас все через id ! проблема в следующем: как разместить 2 блока

<div id="gallery">
<table id="table" border="0">
<tr><td valign="top">
<img src="./img/catalog/host/1/1.jpg" alt="" id="main-img1" />
</td>
<td align="center" valign="top">
<ul>
<li><img src="./img/catalog/host/1/thumb/1.jpg" alt="" width="100" /></li>
<li><img src="./img/catalog/host/1/thumb/2.jpg" alt="" width="100" /></li>
<li><img src="./img/catalog/host/1/thumb/3.jpg" alt="" width="100" /></li>
</ul>
</td>
</tr>
</table>
</div>

рядом ?
Что бы скрипт работал и не надо было для каждого блока прописывать совой id
...
Рейтинг: 0 / 0
Господа, помогите пожалуйста!!!
    #39047739
kunaksergey
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Гость
puzjob,
при одинаковой структуре можно использовать перемещение по дереву:
http://jquery.page2page.ru/index.php5/Работа_с_набором_элементов
...
Рейтинг: 0 / 0
Господа, помогите пожалуйста!!!
    #39047771
puzjob
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Гость
kunaksergey, спасибо большое!
Вот только я абсолютно не разбираюсь в javascript !(( не могли бы вы подсказать (хотя бы примерно, а дальше попробую сам разобраться)
...
Рейтинг: 0 / 0
Господа, помогите пожалуйста!!!
    #39047898
kunaksergey
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Гость
Код: html
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
<html>
<head>
  <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>

<script type="text/JavaScript">
// prepare the form when the DOM is ready 
$(document).ready(function() {

$("#gallery li img").hover(function(){

$(this).closest('td').prev().children('img').attr('src',$(this).attr('src').replace('thumb/', ''));
});
});

</script>
</head> 
<body>
<div id="gallery">
<table id="table" border="0">
<tr><td valign="top">
<img src="./img/catalog/host/1/1.jpg" alt="" />
</td>
<td align="center" valign="top">
<ul>
<li><img src="./img/catalog/host/1/thumb/1.jpg" alt="" width="100" /></li>
<li><img src="./img/catalog/host/1/thumb/2.jpg" alt="" width="100" /></li>
<li><img src="./img/catalog/host/1/thumb/3.jpg" alt="" width="100" /></li>
</ul>
</td>
</tr>
<tr><td valign="top">
<img src="./img/catalog/host/1/1.jpg" alt="" />
</td>
<td align="center" valign="top">
<ul>
<li><img src="./img/catalog/host/1/thumb/1.jpg" alt="" width="100" /></li>
<li><img src="./img/catalog/host/1/thumb/2.jpg" alt="" width="100" /></li>
<li><img src="./img/catalog/host/1/thumb/3.jpg" alt="" width="100" /></li>
</ul>
</td>
</tr>
</table>
</div>
</body>
</html>
...
Рейтинг: 0 / 0
Господа, помогите пожалуйста!!!
    #39048053
puzjob
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Гость
Спасибо, буду разбираться!)
...
Рейтинг: 0 / 0
7 сообщений из 7, страница 1 из 1
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Господа, помогите пожалуйста!!!
Найденые пользователи ...
Разблокировать пользователей ...
Читали форум (0):
Пользователи онлайн (0):
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]