Функция с event ом onclick рад за помош
Помогите пожалуйста мне нужен фунция onclick ом который при нажатии кнопки button с классом plus размер шрифта текста должен увеличиватся по 2 px. Так же при нажатии кнопки button с классом minus должен уменьшится размер текста на 2 px помогите пожалуйста новичку )
|
|
вот мой код помогите пожалуйста ребят)
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <link rel="stylesheet" href="css/style.css"> </head> <body> <p id="header">hello world</p> <button id="plus">plus</button> <button id="minus">minus</button> <script src="js/main.js"></script> </body> </html>
let plus = document.getElementById('plus')
plus.onclick = function () {
let header = document.getElementById('header').style.fontSize = +('2px')
}()
при клике на минус буттон должен уменьшится шрифт а при клике плюс буттон должен увеличиться помогите пожалуйста. |
этот скрипт бесконечно увеличит размер шрифта ? можно ли его только между 24-40 px сделать работаюшим ?
|
изменение размера шрифта по клику
Shoxrux,
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style type="text/css">
#header{
font-size: var(--s, 24px);
}
</style>
</head>
<body>
<p id="header">hello world</p>
<button id="plus" data-up-font="2">plus</button>
<button id="minus" data-up-font="-2">minus</button>
<script>document.addEventListener( "DOMContentLoaded" , function() {
const on = (parent, event, selector, handler) => parent.addEventListener(event, ({target}) => {
if(target = target.closest(selector)) handler(target)
})
const header = document.querySelector("#header");
const fn = ({dataset : {upFont : up}}) => {
let s = parseInt(header.style.getPropertyValue("--s")||24);
s = Math.min(40, Math.max(24, s + +up));
header.style.setProperty("--s", `${s}px`);
}
on(document, "click", "[data-up-font]", fn);
});</script>
</body>
</html>
|
| Часовой пояс GMT +3, время: 19:04. |