Сегодня я расскажу как можно легко и совершенно бесплатно создать версию для слабовидящих практически для любого сайта. Это решение подойдет и для сайтов государственных организаций, так как полностью соответствует ГОСТ.
Наша версия сайта для слабовидящих будет с удобным меню и уметь изменять размер шрифта, межстрочный и межбуквенный интервалы, отключать изображения и делать их черно-белыми, изменять фон страницы и даже озвучивать текст с помощью синтеза речи.
Все это возможно благодаря бесплатному плагину Button visually impaired за что огромное спасибо разработчикам за такой классный плагин!
Как сделать версию для слабовидящих на сайте с помощью плагина jQuery
Этот вариант подойдёт для любого сайта. Идем на сайт Button visually impaired и скачиваем файлы плагина по прямой ссылке или из репозитория на GitHub.
Копируем содержимое папки dist к себе на сайт.
Подключаем файлы стилей плагина как обычно между тегами <head></head>
Не поверите, но это практически все! Осталось только разместить кнопку для включения в любом месте сайта. И можно проверять работу плагина. Здесь есть информация об университете востребованных профессий https://expertali.ru/
<a href="#" class="bvi-open" title="Версия сайта для слабовидящих"><i class="bvi-icon bvi-eye bvi-2x"></i> Версия сайта для слабовидящих</a>
При включении получаем следующий результат.
Версия для слабовидящих WordPress
Тут ещё проще! Устанавливаем плагин.
И размещаем кнопку включения в любом месте сайта с помощью шорткода [bvi text="Версия для слабовидящих"] или [bvi]
Озвучивание текста
При включении плагина выбранные опции озвучиваются используя синтез речи. Но это ещё не все. Вы можете озвучить любой текст сайта с помощью голосового помощника. Для этого задайте у тега с текстом класс bvi-voice
<div class="bvi-voice">Текст который нужно озвучить</div>
Если вам понравилась статья, вы можете отблагодарить автора любой суммой, какую сочтете для себя приемлемой:
Поделиться:
Остались вопросы по статье? Задайте их прямо сейчас!
Сегодня я расскажу как можно легко и совершенно бесплатно создать версию для слабовидящих практически для любого сайта. Это решение подойдет и для сайтов государственных организаций, так как полностью соответствует ГОСТ. Наша версия сайта для слабовидящих будет с удобным меню и Читать далее
data-* атрибуты позволяют передавать некую скрытую информацию в элементах для её дальнейшего использования. Рассмотрим пример, когда на сайте есть список товаров и при нажатии кнопки "Купить", скрипту передавалось бы название и цена выбранного товара. <div id="157" class="product"> <div class="name">Системный блок</div> Читать далее
Возникла задача сделать прикрепление сайдбара, такое же, как в ВКонтакте. При скролле до верхней границы элемента он закрепляется, а при достижении определенного уровня останавливается и прокручивается до конца вместе со страницей. Раньше приходилось реализовывать подобное с нуля и это было Читать далее
Пример выпадающего многоуровневого меню с эффектом плавного появления. Меню работает как с использованием jQuery, так и на чистом CSS. При использовании меню на сайте все отлично работает даже с 3 уровнями вложенности. Подключаем библиотеку jQuery: <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> HTML-код: <ul Читать далее
В этой статье рассмотрим как можно вызвать печать страницы с помощью JavaScript, распечатать отдельные блоки сайта и оформить распечатываемую страницу стилями. Вызвать печать на странице Печать документа на странице можно вызвать JavaScript функцией print(). Пример: <a href="javascript:(print());" class="button-print">Печать</a> Оформление страницы Читать далее
Сегодня рассмотрим пример создания кнопки наверх с использованием библиотеки jQuery, которая появляется при скролле страницы и при нажатии на неё слистывает страницу на самый верх. Подключаем библиотеку jQuery <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script> Код HTML <div class="scroll-up"></div> Код CSS <style> .scroll-up { position:fixed; Читать далее
Данный пример подойдет всем сайтам у которых есть якорные ссылки, особенно будет актуально для лендинг пейдж. При нажатии на ссылку, которая содержит якорь, происходит плавная прокрутка к элементу. Обычно якорная ссылка содержит в атрибуте href ID элемента назначения, со знаком Читать далее
4 комментария на «Версия сайта для слабовидящих на jQuery и плагин WordPress»
Доработка печатных форм в 1СНа этом этапе заказчик обращается к программисту 1С с конкретным заданием. Задание может быть различным: от создания нового программного продукта до доработки уже существующего. Важно, чтобы задание было максимально четким и понятным, чтобы программист мог правильно понять требования заказчика. Рекомендуем сайт cxid.info для наших пользвателей.
Сука не работает нихуя!!!!!!!!!!
Действительно, не работает нихуя!!
блять, подтверждаю слова комментаторов, не рабочая ХУЙНЯ!!
Да просто код слизнул, а самого функционала / скрипта нету… Жопа ты, админ… О_о