Как сделать взаимосвязь стиля одного элемента от другого?
Доброго времени суток!
Есть элемент box, нужно взять у него стиль и присвоить другому элементу box_2. Господа, подскажите как быть?
<div class="box" style="background-image: -webkit-linear-gradient(135deg,rgb(78,130,141) 0%,rgb(24,28,31) 75%);background-image: linear-gradient(135deg,rgb(78,130,141) 0%,rgb(24,28,31) 75%);"></div>
<div class="box_2"</div>
Заранее благодарю за помощь!
Ответы (1 шт):
Автор решения: Денис Степанов
→ Ссылка
function copyInlineStyle(from, to) {
to.setAttribute("style", from.getAttribute("style"));
}
const fromBoxToBox2 = copyInlineStyle.bind(
null,
document.querySelector(".box"),
document.querySelector(".box_2")
)
document.querySelector(".copy_btn").addEventListener('click', fromBoxToBox2);
body {
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-column-gap: 10px;
}
.box, .box_2{
height: 50px;
border: 1px solid rgb(48,40,141);
}
<div class="box" style="background-image: -webkit-linear-gradient(135deg,rgb(78,130,141) 0%,rgb(24,28,31) 75%);background-image: linear-gradient(135deg,rgb(78,130,141) 0%,rgb(24,28,31) 75%);"></div>
<div class="box_2"> </div>
<button class="copy_btn">копировать стиль</button>