Изменение размера текста на странице
Сегодня будет очень короткий урок про скрипт, который позволит Вашим посетителям уменьшать или увеличивать шрифт на страницах сайта.
Иногда текст на Вашем сайте может быть для посетителей слишком велик или, наоборот, мал. В таком случае было бы удобно предоставлять функцию изменения его размера.
Давайте взглянем на пример страницы:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<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>
</head>
<body>
<p>
<a href="javascript:void(0);" onclick="changeFontSize('content','2');">Increase font</a>
<a href="javascript:void(0);" onclick="changeFontSize('content',-2);">Decrease font</a>
</p>
<p id="content" style="font-size:12px;">
Добро пожаловать на сайт Евгения Попова!!!
</p>
</body>
</html>
Вот и все :) Такая простая функция в начале странички делает всю работу. Сверху документа мы поместили 2 ссылки - одна для уменьшения, вторая - увеличения. Базовым размером текста мы определили 12 размер. При нажатии он увеличивается или уменьшается на 2 пункта.
Урок получился небольшой, но практичный и может многим пригодиться.
Всем удачи!
Комментарии:
Нету комментариев для вывода...