Замена фото по клику

PHP
1
2
3
4
5
6
7
8
9
$(function() {
  $('.select-list ul li').hover(function(){
    var id = $(this).attr('id');
    $('.select-list ul li').removeClass('active');
    $(this).addClass('active');
    $('.circle ul li').removeClass('active');
    $('[data-pic="'+id+'"]').addClass('active');
  });
});

PHP
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
.bl-1
  .circle
    ul
      li.active(data-pic="image-1")
        img(src="/img/foto-list-1.jpg")
      li(data-pic="image-2")
        img(src="/img/foto-list-2.jpg")
      li(data-pic="image-3")
        img(src="/img/foto-list-3.jpg")
      li(data-pic="image-4")
        img(src="/img/foto-list-4.jpg")
      li(data-pic="image-5")
        img(src="/img/foto-list-5.jpg")
      li(data-pic="image-6")
        img(src="/img/foto-list-6.jpg")
      li(data-pic="image-7")
        img(src="/img/foto-list-7.jpg")
      li(data-pic="image-8")
        img(src="/img/foto-list-8.jpg")
      li(data-pic="image-9")
        img(src="/img/foto-list-9.jpg")
      li(data-pic="image-10")
        img(src="/img/foto-list-10.jpg")

PHP
1
2
3
4
5
6
7
8
9
10
11
12
13
.bl-2
  .select-list
    ul
      li.active(id="image-1") Мягкую мебель, кровати
      li(id="image-2") Шкафы, стулья, столы
      li(id="image-3") Бытовую технику
      li(id="image-4") Спортивный инвентарь, велосипеды
      li(id="image-5") Садовые инструменты, стройматериалы
      li(id="image-6") Автомобильную резину, шины
      li(id="image-7") Личные домашние вещи
      li(id="image-8") Туристическое снаряжение
      li(id="image-9") Сумки, чемоданы
      li(id="image-10") Архивы, документы