ChangeSizeR

by George Bash

HTML

<input id="impaired" type="range" step="1" min="12" max="16" value="14"><br><hr>

<div class="wrapper-site">
<h2>Георгий</h2>
<p>Анастасия</p>
<div class="other">
<h2>Мария</h2>
<p>Елена</p>
</div>
</div>

CSS

.wrapper-site h2{
  font-size: 22px;
  margin: 5px 0;
  padding: 5px 0;
}
.wrapper-site p{
  font-size: 14px;
  margin: 5px 0;
  padding: 5px 0;
}

.other h2{
  font-size: 22px;
  margin: 5px 0;
  padding: 5px 0;
}
.other p{
  font-size: 14px;
  margin: 5px 0;
  padding: 5px 0;
}

JavaScript

( function() {
var rng = document.getElementById('impaired');
var text = document.querySelector(".wrapper-site p");
var text2 = document.querySelector(".other p");
rng.addEventListener("input", function() {
	text.style.fontSize = rng.value + 'px'
  text2.style.fontSize = rng.value + 'px'
});
})();