Показать сообщение отдельно
  #28 (permalink)  
Старый 24.02.2016, 19:17
Аспирант
Отправить личное сообщение для olmensk Посмотреть профиль Найти все сообщения от olmensk
 
Регистрация: 24.02.2016
Сообщений: 33

А можно ещё один, последний вопрос? ))) понимаю, что поднадоел, но сам не разберусь ((

Сейчас при каждом нажатии появляется название с новой строки, даже если 5раз нажать на одну и туже картинку, то её название 5 раз появитя друг за другом.

Как сделать, что б в bottom2 название каждой картинки появлялось 1раз из каждого аккордеона?

Тоесть обьясню.

1й аккордеон: например в нём 3 картинки и я нажал на 1-ю, появилось название 1й, потом нажал на вторую, и название с первой сменилось на 2ю. В итоге из первого аккордеона в bottom2 только одно название высветилось той картинки которую нажимал.

2й аккодеон: (В bottom2 уже есть название из аккрдеон1) и смысл такой же, какую б я картинку не клацал в аккордеон2 , то в bottom2 рядом с названием из 1го аккордеона, появлялось название из второго.

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

..надеюсь понятно..

<div class="bottom1"></div><!--блок который будет закрашен выбранной картинкой из любого акордеона-->
<div class="bottom2"></div><!--блок в котором напишется название картинки которая закрасит блок bottom1-->

<div id="mydiv3"><!--аккордеон1 в котором картинка которая будет красить блок bottom1-->
<ul class="list-bottom"> 
<li path-img="images/1.jpg"><img src="images/1.jpg" data-title="текст1 mydiv3"></li> <!--1-путь; 2-превью-->
<li path-img="images/2.jpg"><img src="images/2.jpg" data-title="текст2 mydiv3"></li> <!--1-путь; 2-превью-->
</ul> 
</div>

<div id="mydiv4"><!--аккордеон2 в котором картинка которая будет красить блок bottom1-->
<ul class="list-bottom"> 
<li path-img="images/1.jpg"><img src="images/1.jpg" data-title="текст1 mydiv4"></li> <!--1-путь; 2-превью-->
<li path-img="images/2.jpg"><img src="images/2.jpg" data-title="текст2 mydiv4"></li> <!--1-путь; 2-превью-->
</ul> 
</div>


<!--скрипт окрашивания картинкой блока-->
$(document).ready(function(){
    $('.bottom1 li').click(function () {      
      var img_path = $(this).attr("path-img"), title = $("img",this).data("title"); // Путь к изображению      
      $('.bottom1 li').css("border-color","white"); // Сбрасываем у тегов li рамку, ставим цвет белый
      $(this).css("border-color","#000"); // Устанавливаем красную рамку у выбранной картинки
      $('.bottom1').css('background','url('+img_path+') repeat'); // Меняем фон bottom1  
	  $('.bottom2').html($('.bottom2').html() + "<br>"+ title); // пишем название в bottom2  
    });            
});

Последний раз редактировалось olmensk, 24.02.2016 в 19:46.
Ответить с цитированием