» »

Меняем размер шрифта на сайте


Меняем размер шрифта на сайте

Бывают такие моменты когда пользователь сайта не может рассмотреть информацию из-за маленького шрифта. Есть множество интернет ресурсов, где заходишь и шрифт там слишком мелкий, и изо этого посещаемость его падает, хоть на нем оригинальный контент. С этим скриптом, вы сможете вывести ту ширину, которая позволить отлично видеть все знаки, или как говорят, станет читабельный в отличном прописывание.

Вверх сайта в head: 

Код

<script>
function changeFontSize(element,step)
{
step = parseInt(step,10);
var el = document.getElementById(element);
var curFont = parseInt(el.style.fontSize,10);
el.style.fontSize = (curFont+step) + 'px';
}
</script>

В месте где надписи или кнопки:
Код

<a href="javascript:void(0);" onclick="changeFontSize('content','2');">Увеличить текст</a>

<a href="javascript:void(0);" onclick="changeFontSize('content',-2);">Уменьшить текст</a>

Сверху 2 ссылки - одна для уменьшения, вторая - увеличения. Базовым размером текста определили 12 px. При нажатии он увеличивается или уменьшается на 2px.
Ну и оборачиваем текст:
Код

<p id="content" style="font-size:12px;">
Добро пожаловать на сайт!</p>

Демо
Источник: rudebox.org.ua
Данное решение простое и не такое крутое как "Версия для слабовидящих", но и из него можно вытащить выгоду.
24.03.2016 Просмотров: 420 Комментарий: (5)

Поделиться в социальных сетях

Материал разместил

Комментарий: 5
Tergran
Tergran 25.03.2016 14:051
0
А, что в CSS уже не можно менять?
Сопрано
Сопрано 25.03.2016 14:282
0
Но это как видно не под весть текст идет.
Angerfist
Angerfist 25.03.2016 14:423
0
Да для определённых участков текста, не стал для всего сайта оптимизировать, такие скрипты уже есть
Kosten
Kosten 25.03.2016 14:564
0
Angerfist, что то не пойму, в статье можно стандартно применить, а здесь как пример, можно где установить, или он какой то оригинальный шрифт выводить будет.
Angerfist
Angerfist 25.03.2016 15:185
0
Он будет просто менять размеры шрифта базовых стилей сайта, в демо там применили стили, я их вырезал оставил основу
avatar