Данный скрипт даст возможность читать текст материала без отвлечения на дизайн сайта, выведя текст материала на отдельный блок.
Просто, но может где и пригодится.
Установка:
Зайдите в ПУ > Управления дизайном > Страница материала и комментария к нему и добавьте в удобное место следующий код:
Код
<div class="read_mode" title="ВКЛючить режим чтения" onclick="$('.read_mode_on').show();$('html, body').css('overflowY','hidden');"></div>
<div class="read_mode_on" style="display:none">
<div class="read_mode" title="ВЫКЛючить режим чтения" id="off" onclick="$('.read_mode_on').hide();$('html, body').css('overflowY','auto');"></div>
<div class="mess fix"><?if($MESSAGE$='')?>$MESSAGE$<?else?>$BRIEF$<?endif?></div>
Далее зайдите в ПУ > Управления дизайном > Таблица стилей (CSS) и добавьте в самый низ этот код:
Код
.read_mode {top: 10vh; left: 100px;} /* Position */
.read_mode {width: 30px; height: 30px; position: fixed; background: #ddd url('/img/rd_ico.png') no-repeat center / 24px; border-radius: 50%; overflow: hidden; box-shadow: 0 0 0 1px rgba(34,34,34,.02) inset;}
.read_mode:hover {opacity: .7;}
.read_mode_on {width: 100%; height: 100%; z-index: 9999; position: fixed; left: 0; top: 0; right: 0; bottom: 0; background: rgba(34,34,34,.95); box-shadow: 0 0 5px 0 #343434;}
.read_mode_on .mess {width: calc(80% - 40px); height: calc(80% - 20px); margin: 5% auto; padding: 10px 20px; background: #343434; color: #fff; font-size: 15px; line-height: 1.5; overflow-x: hidden; overflow-y: auto;}
.read_mode_on .mess.fix img, .read_mode_on .mess iframe, .read_mode_on .mess video {max-width: 100%;}
Поделиться новостью в социальной сети.
Добавлять комментарии могут только зарегистрированные пользователи.
[
Регистрация |
Вход ]