Я пытался изменить переменную при нажатии на Id, который сейчас работает.Следующим шагом будет добавление переменной в URL для изменения фонового изображения.Тем не менее, после нескольких часов поиска и много попыток, я не могу найти способ добавить переменную в URL.
(Идея всего этого состоит в сетке, в которой вы можете разместить значки на местах, которые выхочу. И, таким образом, выберите значок с идентификаторами, а затем поместите их в сетку с классами, называемыми пикселями).
url = 'url'
icon = '(icon.png)'
$('#p1').click(function (){
icon = "icon2.png";
alert(icon);
});
$('#p2').click(function (){
icon = "icon3.png";
alert(icon);
});
// onclick function classes
$(".pixel").click(function() {
//function that changes background to url
// $(this).css('background-image', var(icon));
$(this).css("background-image", "url(" + icon ")");
});
<div id="p1" class="pen"></div>
<div id="p2" class="pen"></div>
<div id="art">
<div class="row">
<div class="pixel"></div>
<div class="pixel"></div>
</div>
</div>
#art {
display: table;
border-spacing: 1px;
background-color: black;
border: 1px solid black;
}
.row {
display: table-row;
}
.pixel {
display: table-cell;
background-color: white;
width: 25px;
margin: 1px;
height: 25px;
background-size: contain;
}
.pen {
display: inline-block;
width: 40px;
height: 40px;
border: 2px solid black;
}