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

var rng = document.querySelector('#impaired');
var selectors = ['body', '.wrapper-site p'];
rng.addEventListener('change', function() {
    selectors.forEach(function(sl) {
        document.querySelector(sl).style.fontSize = rng.value + 'px';
    })
});