WebElement - это сборник дизайнерских мелочей А также скриптов, помогающих вам в сайто-строении. Мы поможем вам сделать сайт красивее, мобильнее и удобнее. У нас вы можете найти готовые решения на: HTML, CSS\CSS3, jQuery, JS, плагинам к библиотеке JQ и не только... Используйте только качественные скрипты на своих сайтах.
Перед тем как ставить к себе на сайт, давайте посмотрим демо-пример.
Вот теперь приступим к установке. Для начала установим стили CSS:
Code
#lastcomment { width:250px; /*-Размеры нужно поменять на свои-*/ height: 160px; /*-Не желательно трогать (влияет на количество комментариев)-*/ overflow: hidden; }
#lastcomment li { display:inline-block; list-style:none; width:230px; /*-так же поменять на свои (пропорционально #lastcomment - на 20px меньше)-*/ height: auto; border: 1px dotted #444; padding: 5px; margin: 0px 5px; font-style: italic; font-size: 12px; }
Теперь заходим в "информеры" и создаем новый информер с параметрами: Название информера:На ваше усмотрение Раздел:Комментарии Модуль:По вашему желанию (Если нужно со всех, то - выбираем "Все модули") Количество материалов:По вашему желанию ( лучше от 10 до 30 ) Количество колонок:Обязательно 1 Максимальная длина текста комментария:Не важно, но лучше ограничить примерно до 200. Отлично, теперь открываем Шаблон информера и вставляем вот такой код:
Теперь нужно добавить не большой код JS перед закрывающимся тегом body (желательно зайти: Управление дизайном » нижняя часть сайта.) и добавить вот такой код:
Code
<script type="text/javascript"> function tick(){ $('#lastcomment li:first').slideUp( function () { $(this).appendTo($('#lastcomment')).slideDown(); }); } setInterval(function(){ tick () }, 3000); }); </script>
Теперь осталось вывести информер. Для этого нужно скопировать его код, у меня это - $MYINF_3$ у вас может быть другой. И вставляйте там где вы его хотите видеть (желательно в Первый контейнер или во второй, смотря какой дизайн) Перед вставкой нужно обвести его в див: