Скрыть / Показать текст (выезжающий текст) в ExpressionEngine
Итак, допустим, у нас есть текст вступление и текст, который нам необходимо показать, нажав на кнопку “Показать текст” или “Показать подробности”.
Для данного решения нам потребуется jquery-1.2_.1_.pack_.zip и дописать в css файл строчку
.opis {display:none; text-align:justify}
В head прописываем путь к нашем файлу скриптов
<script type="text/javascript" src="адрес_сайта/scripts/jquery-1.2.1.pack.js"></script>
где “адрес_сайта” - адрес сайта ;)
Итак, у нас есть шаблон, в котором выводится список записей:
{exp:weblog:entries ....}
{vstuplenie}
<a href="javascript:void(0)" id="opislink{entry_id}">Показать подробности</a>
<div class="opis" id="opis{entry_id}">{podrobnosti}</div>
<script type="text/javascript">
$(document).ready(function() {
$('#opislink{entry_id}').click(function() {
$('#opis{entry_id}').toggle("slow");
if ($('#opislink{entry_id}').text()=='Показать подробности') {
$('#opislink{entry_id}').text('Скрыть подробности');
} else {
$('#opislink{entry_id}').text('Показать подробности');
}
});
});
</script>
{/exp:weblog:entries}
где {vstuplenie} - поле вступления,
{podrobnosti} - подробности статьи.
Таким образом, при нажатии на “Показать подробности” у нас выезжает текст п подробностями, соответственно, нажимаем “Скрыть подробности” - текст заползает обратно. Все красиво, все просто.
Пример можно посмотреть здесь http://media-polus.ru/research/C1
Оставить комментарий
Запустил скрипт на локальном компьютере. Ничего не работает. В чем причина?
У меня не заработал выезжающий текст... а выглядет очень красиво.
PS А что значит в шаблоне это?
{exp:weblog:entries ....}
{/exp:weblog:entries}
Оставить комментарий