Проблема с "parents"
Всем доброго времени суток.
Есть скрипт который при нажатии на миниатюру меняет главную картинку. То есть нарисован стол и под ним есть маленькие картинки с изображением текстур, при нажатии на текстуру меняется картинка со столом на цвет текстуры. Это все уже реализовано. Но реализовано через одно место. То есть в HTML - http://mrfelix.ru/meb-eko.html стоит следующий код: <div class="middle_col"> ... <td style="WIDTH: 465px" rowSpan="3"><img id="thumbnail" class="photo" src="images/meb-eko_buk.jpg" width="450"> ... <div class="colors"> </div></td><td></td></tr></tbody></table></div> и <div class="middle_col"> ... <td style="WIDTH: 465px" rowSpan="3"><img id="thumbnail2" class="photo" src="images/meb-eko_buk.jpg" width="450"> ... <div class="colors2"> ... </div></td><td></td></tr></tbody></table></div> Полный код соответственно можно посмотреть перейдя по ссылке. Пока получилось сделать следующим образом: (файл - http://mrfelix.ru/js/jquery.inforos.js) $('.colors a').click(function(e) { var self = $(this); var thumb = $('#thumbnail'); thumb.attr('src', this); $('.colors a').removeClass('active_color'); self.addClass('active_color'); e.preventDefault(); }); и $('.colors2 a').click(function(e) { var self = $(this); var thumb = $('#thumbnail2'); thumb.attr('src', this); $('.colors2 a').removeClass('active_color'); self.addClass('active_color'); e.preventDefault(); }); Так все работает. Но поскольку таких изделий у меня три десятка, то это не самый удачный способ. Советуясь с людьми мне предложили заменить код выше на: $(document).ready(function() { $('.colors > a').each(function() { $(this).attr('data-img',$(this).attr('href')); $(this).attr('href','javascript:void(0);'); $(this).click(function(){ $(this).parents('table').find('#thumbnail').attr(' src', $(this).attr('data-img')); }) }); }); Что сейчас и висит на сайте. Собственно проблема в том, что оно не работает как надо. То есть в "thumbnail" работает как надо, а в "thumbnail2" открывается стол в новом окне. Прошу помочь мне с этим всем безобразием. PS И еще, я работаю конструктором мебели и прошу по возможности использовать фразы которые если я не пойму, то хотя бы смог загуглить :). А то бывает жаргонизмы сложно понять. |
Цитата:
$(this).click(function(){ $(this).parents('table').find('#thumbnail').attr('src', $(this).attr('data-img')); Замените на эту $(this).click(function(){ $(this).parents('table:first').find('#thumbnail,#thumbnail2').attr('src', $(this).attr('data-img')); |
Deff, спасибо за внимание.
Решилось все немного иначе: "thumbnail2" изменил на "thumbnail" и тоже самое с "color2". И в конце body поставил <script type="text/javascript"> $(document).ready(function() { $('.colors > a').each(function() { $(this).bind('click', function(e) { $(this).parents('div.middle_col').find('.photo').attr('src', $(this).attr('href')); e.preventDefault(); }) }); }); </script> , а http://mrfelix.ru/js/jquery.inforos.js отключил. Сказать сразу о том, что вопрос закрыт не смог, так как отрубился интернет :) . |
Часовой пояс GMT +3, время: 02:44. |