Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 30.05.2012, 21:14
Новичок на форуме
Отправить личное сообщение для Феликс Юрьевич Посмотреть профиль Найти все сообщения от Феликс Юрьевич
 
Регистрация: 30.05.2012
Сообщений: 2

Проблема с "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 И еще, я работаю конструктором мебели и прошу по возможности использовать фразы которые если я не пойму, то хотя бы смог загуглить . А то бывает жаргонизмы сложно понять.

Последний раз редактировалось Феликс Юрьевич, 30.05.2012 в 21:31.
Ответить с цитированием
  #2 (permalink)  
Старый 30.05.2012, 22:15
без статуса
Отправить личное сообщение для Deff Посмотреть профиль Найти все сообщения от Deff
 
Регистрация: 25.05.2012
Сообщений: 8,219

Сообщение от Феликс Юрьевич
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'));
Ответить с цитированием
  #3 (permalink)  
Старый 31.05.2012, 09:21
Новичок на форуме
Отправить личное сообщение для Феликс Юрьевич Посмотреть профиль Найти все сообщения от Феликс Юрьевич
 
Регистрация: 30.05.2012
Сообщений: 2

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 отключил.
Сказать сразу о том, что вопрос закрыт не смог, так как отрубился интернет .
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Проблема с Popup окном vovuslik jQuery 5 12.06.2010 16:12
Проблема с дизайном после отправки xmlhttprequest, Проблема с дизайном после отправки cyberx AJAX и COMET 3 01.05.2010 17:07
Проблема с CSS COKOJIOB (X)HTML/CSS 5 04.08.2009 14:19
Проблема, в менюшке Большой джо Элементы интерфейса 0 12.07.2009 17:12
Проблема спама lliberty AJAX и COMET 1 12.03.2009 16:47