1

Есть transform: scale

table#pixel_canvas {
    transform: scale(1);
}

Как можно реализовать изменение scale(1) по нажатию на кнопки (+ & -) с шагом в 0.1 ?

1
  • Вынесите стиль элемента инлайном и меняйте с помощью JS
    – Neolot
    12 апр 2020 в 12:40

1 ответ 1

6

Я реализовал это данным образом:

let size = 1
const step = 0.1
const block = document.querySelector('div')

document.querySelector('#minus').addEventListener('click', () => {
  size -= step;
  block.style.transform = `scale(${size})`
})

document.querySelector('#plus').addEventListener('click', () => {
  size += step;
  block.style.transform = `scale(${size})`
})
div {
  width: 200px;
  height: 200px;
  background-color: red;
  transform-origin: left top;
}
<button id="plus">+</button>
<button id="minus">-</button>
<br><br><br>
<div></div>

codepen

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими пользовательским соглашением, политикой конфиденциальности и политикой о куки

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.