Сокращаем полное описание больше/меньше

Скрипты DLE / DLE модули


Сокращаем полное описание большеСкрипт сокращает вывод содержимого полной новости и раскрывает её при нажатии на ссылку > БОЛЬШЕ. И соответственно на оборот, при нажатии > МЕНЬШЕ - скрывает часть содержимого. Версия DLE: 13.x-14.x

Сокращаем полное описание меньше

Установка:
1. В файл CSS шаблона добавить стили:
.full-desc{overflow:hidden;position:relative;transition:height .2s} .text-less{margin-bottom:0!important} .text-less:before{content:'';position:absolute;z-index:1;bottom:0;left:0;right:0;height:120px;pointer-events:none;background:-webkit-linear-gradient(top,rgba(255,255,255,0) 0%,#fff 100%);background:linear-gradient(to bottom,rgba(255,255,255,0) 0%,#fff 100%)} .show-more{margin:0 0 20px;font-size:12px;font-weight:700} .show-more span{display:inline-block;cursor:pointer;text-decoration:underline;color:#f0542e}

2. Подключить JS код:
<script> $(document).ready(function() { $('.full-desc').ShortText({ height: '200', text: 'Больше' }); }); jQuery.fn.ShortText = function(e) { var e = jQuery.extend({ height: "200", text: "Больше" }, e); return this.each(function() { var i = $(this), t = i.height(); t > e.height && i.addClass("full-desc text-less").height(e.height).after('<div class="show-more"><span>' + e.text + "</span></div>"), $(".show-more span").click(function() { var i = $(this), s = $(this).parent().prev(".full-desc"); ah = parseInt(s.css("height"), 10), ah == t ? s.css({ height: e.height }) : s.css({ height: t }), i.text(i.text() == e.text ? "Меньше" : e.text), s.toggleClass("text-less") }) }) }; </script>

3. В нужном месте fullstory.tpl добавить:
<div class="full-desc clearfix">{full-story}</div>


Поделись страницей с друзьями!





СКАЧАТЬ "DLE модули"



Изменить стандартный Ajax окно для uCoz
Изменить стандартный Ajax окно для uCoz
07.10.2021, Скрипты Ucoz
Кнопка скачать для uCoz c эффектами на CSS
Кнопка скачать для uCoz c эффектами на CSS
07.10.2021, Скрипты Ucoz
Варианты эффекта CSS увеличение изображений
Варианты эффекта CSS увеличение изображений
07.10.2021, Скрипты Ucoz
Адаптивный вид материалов Metro 2 колонки для uCoz
Адаптивный вид материалов Metro 2 колонки для uCoz
27.09.2021, Скрипты Ucoz
Скрипт для uCoz: Вид материалов c красивым эффектом
Скрипт для uCoz: Вид материалов c красивым
26.09.2021, Скрипты Ucoz
Скрипт режим чтения v2 для uCoz
Скрипт режим чтения v2 для uCoz
24.09.2021, Скрипты Ucoz
Movie
В данной публикации отсутствуют комментарии !

Перед публикацией, советую ознакомится с правилами!

{login}

Твой комментарий..


Кликните на изображение чтобы обновить код, если он неразборчив

9 посетителей на сайте. Из них:
Гости6
Роботы3