×
Внимание, мошенник-работодатель (10 авг 2017)

Вниманию программистов Санкт-Петербурга, на SuperJob-е вновь активизировался Семен Григорьевич Шумейко..

Вопрос Меняем размер шрифта при помощи JavaScript

Больше
6 года 7 мес. назад - 6 года 7 мес. назад #1 от Aleksej
Aleksej создал эту тему: Меняем размер шрифта при помощи JavaScript
1. Сохраняем в папке шаблона java-script (скачать и распаковать).

2. Перед закрывающим тегом </head> в файле index.php шаблона вставляем следующий код:
<script type="text/javascript" language="javascript" 
src="<?php echo $mosConfig_live_site;?>/templates/<?php echo $cur_template; ?>/md_stylechanger.js">
</script>
Вместо <?php echo $cur_template; ?> можно вписать название шаблона.

3. Определяем часть шаблона, где будет отображаться кнопка переключения размера шрифта (или текст) и вставляем следующий код:

Для отображения кнопок:
<a href="index.php" title="Увеличить размер" onclick="changeFontSize(1);return false;">
   <img src="templates/<?php echo $cur_template; ?>/images/larger.png" border="0" alt="больше" />
</a>
<a href="index.php" title="Уменьшить размер" onclick="changeFontSize(-1);return false;">
   <img src="templates/<?php echo $cur_template; ?>/images/smaller.png" border="0" alt="меньше" />
</a>
<a href="index.php" title="Размер по-умолчанию" onclick="revertStyles(); return false;">
  <img src="templates/<?php echo $cur_template; ?>/images/reset.png" border="0" alt="сброс" />
</a>
Для отображения текста:
<a href="index.php" title="Увеличить размер" onclick="changeFontSize(1);return false;">[A +]</a>
<a href="index.php" title="Уменьшить размер" onclick="changeFontSize(-1);return false;">[A -]</a>
<a href="index.php" title="Размер по-умолчанию" onclick="revertStyles(); return false;">[Сброс]</a>
4. Открываем CSS-файл шаблона (например, template_css.css) и меняем единицы измерения шрифтов html-элементов (размер шрифтов которых должен меняться) на относительные, т.е. px и pt меняем на % или em.

При необходимости обращаемся к страничке визуального пересчета .

В итоге мы должны получить примерно следующее:
p, div, td {
 font-size: 0.9em
}
Все; сохраняем изменения и испытываем.

Примечание: Если не работает изменение размера шрифта, а происходит обновление страницы или переход по ссылке после нажатия на кнопку изменения размера, то это значит, что JavaScript не работает (не грузится) и необходимо проверить правильность написания пути к нему.
Последнее редактирование: 6 года 7 мес. назад от Aleksej.

Пожалуйста Войти или Регистрация, чтобы присоединиться к беседе.