Beegun,
Не знаю, как тебе объяснить, ты пишешь полную ахинею:). Подожди, может кто-нибудь тебе подскажет решение на чистом жеквери. |
Beegun,
Или опиши задачу словами, подробно и полно, я завтра выложу тебе готовое решение, если пойму твое описание:) |
Задача такова. На странице 2 таблицы слева пустая ячейки имеют id obj_id. справа таблица с картинками разное количество. Нужно сделать раскраску, то-есть нажимаешь на картинку и в переменной записывается src картинки, а потом тыкаешь на ячейки пустой таблицы чтобы их bachground image получал src из переменной. Как-то так.
|
<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>
|
Всем огромное спасибо, tsigel, прикрутил ваш скрипт к своим таблицам, получилось то, что нужно. На последок, нужна стиралка, то-есть кнопка, после нажатия которой в переменную вписывается значение, которое будет убирать background image. Если не трудно)
|
Beegun,
Вам по нажатию кнопки надо менять src и тогда при клике на ячейку он заменит src на тот что вы поменяли в нажатии кнопки. Попробуйте, это не сложно! Если что - помогу. |
tsigel, решил вопрос так
eraser.onclick = function() {
src = "///";
Насколько это безобразно? |
Beegun,
Ну там наверно в консоли ошибки что он не может скачать этот урл, но для костыля сойдет. Не плохо! Для того чтобы сделать нормальный ластик надо удалять совсем 'backgroundImage'; Логику можно оставить почти ту же. Типа жмем на кнопку стирания, и записываем флаг что сейчас мы стираем. при клике на ячейку мы проверяем: если надо удалять - удаляем и убираем флаг обратно (чтобы он все время не удалял), а в противном случае смотрим на переменную src - и как и было. |
Ну да, так и есть, выглядит так
style="background-image: url(http:);Однако ошибок в консоли нет) Судя по тому что вы написали, скрипт будет весомый. |
Beegun,
да вобщем-то нет, просто я описал алгоритм. Я так понимаю, что Вы вполне в состоянии по мануалам понять как сделать что-либо если знаете что надо делать. Это очень хорошо, Вы просто пока не понимаете как придумать что делать, но по началу это нормальнльно. По сути вам надо добавить условие которое проверяет, нажимали ли на ластик. И если да - то удалять стиль, а если нет - то как раньше. Совсем немного, не правда ли? |
| Часовой пояс GMT +3, время: 14:25. |