Показать сообщение отдельно
  #14 (permalink)  
Старый 09.09.2015, 07:46
Профессор
Отправить личное сообщение для tsigel Посмотреть профиль Найти все сообщения от tsigel
 
Регистрация: 12.12.2012
Сообщений: 1,398

<style>
   .col {
       width: 50px;
       height: 50px;
       float: left;
       margin: 10px;
       border: 1px solid #000;
       border-radius: 5px;
       background-size: 100%;
       background-repeat: no-repeat;
       background-position: center;
   }
</style>

<img class='img' src='http://yabs.yandex.ru/resource/CuIsr6zAhrqK3bLdAytNR6_banana_20141031_icon-retina.png' />
<img class='img' src='http://yabs.yandex.ru/resource/CNQFYjt7nmId0Iot3YY61k_banana_20141031_plane.png' />

<div class='col'></div>
<div class='col'></div>

<script>

    var src;
    Array.prototype.forEach.call(document.querySelectorAll('.img'/*селектор картинки*/), function (img) {
        img.addEventListener('click', function () {
            src = this.src;
        }, false);
    });
    Array.prototype.forEach.call(document.querySelectorAll('.col'/*селектор ячейки*/), function (col) {
        col.addEventListener('click', function () {
            if (src) {
                this.style.backgroundImage = 'url(' + src + ')';
            }
        }, false);
    });

</script>
Ответить с цитированием