Перейти к контенту

Раскрывающийся текст


Рекомендуемые сообщения

Может кому нужно будет, объясняю как сделать раскрывающийся текст:

 

Админка - УПРАВЛЕНИЕ - Дополнительные BB-коды - Добавить

 

Название BB-кода - Раскрывающийся текст

Полное описание этого BB-кода - При клике на ссылку текст раскрывается

Пример этого BB-кода - [expand]тута текст... ляляля...тут еще текст...ляляля[/expand]

Тэг этого BB-кода

Использовать опции в теге? - Нет

Замена BB-кода:

<div>
<div style="cursor: pointer; color: #847441; font-size: 12px; font-family: Verdana, Tahoma, Helvetica, sans-serif; text-decoration: none" onclick="show_hide_text(this)">показать</div>
<div style="display: none">
{content}
</div>
</div>

 

Далее, идем в ВНЕШНИЙ ВИД - Изменить общий шаблон форума:

Находим:

<% JAVASCRIPT %> 
</head>

Заменяем на:

<% JAVASCRIPT %> 
<script type="text/javascript" src='адрес_до_скриптов/скрипт.js'></script>
</head>

 

Содержимое файла скрипт.js:

/**
* Copyright, Aliance, 2004
**/
function show_hide_text(divObj) {
var div = divObj.parentNode.getElementsByTagName('div')[1];
if (div.style.display == 'none') {
	div.style.display = 'block';
	divObj.innerHTML = "скрыть";
} else {
	div.style.display = 'none';
	divObj.innerHTML = "показать";
}
}

 

Работает во всех современный браузерах, протестирован в FireFox 2 и IE 6

Ссылка на комментарий
Поделиться на других сайтах

  • 2 недели спустя...
  • Ответы 55
  • Создана
  • Последний ответ

Лучшие авторы в этой теме

Лучшие авторы в этой теме

Загружено фотографий

Чудок дорабатываем:

- не подгружаем весь текст

- подружаем (реализуем с юзанием AJAX) весь текст когда пользователи тыркают на "Показать"

 

и получится не плохой тег типа More

Ссылка на комментарий
Поделиться на других сайтах

xRay,

И где такой расширенный можно достать? =)

Ссылка на комментарий
Поделиться на других сайтах

xRay не совсем понял, эти 2 пунта ты имел ввиду как отдельные или как вместе? Если вместе - то сделать можно было бы, только я смысла особого не вижу - ведь это сделано для небольших по размеру кусков текста. А если ты имел ввиду по отдельности - тогда вопрос: а зачем?
Ссылка на комментарий
Поделиться на других сайтах

Все вместе.

Какой в этом смысл? Да очень простой такой же как от ссылки Дальше или там Продолжение т.е. трафика меньше жраться будет там гед тексты выкладывают большие.

Т.к. не факт что захочеш тыркунть на Подробнее так ведь?

Ну а насчет AJAX это типа для удобства юзания т.е. юзабелити.

Ссылка на комментарий
Поделиться на других сайтах

  • 3 недели спустя...
а как сделать что бы этот тег включался кнопокой?
А он чем включается? Или вам нужна в редакторе кнопочка [expand] тогда в поиск "Добавление кнопок в форму ответа"
Ссылка на комментарий
Поделиться на других сайтах

Aliance spb

 

А можно как-нибудь сделать что бы вместо слова "показать" можно было бы писать что-нибудь своё?

 

А-ля, что-нибудь вроде - [expand=что-то своё]бла бла бла бла бла[/expand] =)

 

А если бы он ещё и мог "тэг в тэге" работать(Например:

[expand]ляляляляляля[expand]тутуту[/expand]ляляляля[/expand]),

вообще хорошо было бы =)

Ссылка на комментарий
Поделиться на других сайтах

  • 1 месяц спустя...
добавление кнопки в форму ответа

я лично так добавил, работает в обоих редакторах

 

а я с недавних пор сам научился любую кнопочку для любого тега сделать :D

Ссылка на комментарий
Поделиться на других сайтах

  • 3 недели спустя...

небольшая модификация

содержание файла expand.js

function show_hide_text(divObj,text) {
var div = divObj.parentNode.getElementsByTagName('div')[1];
if (div.style.display == 'none') {
	div.style.display = 'block';
	divObj.innerHTML = text + " (скрыть)";
} else {
	div.style.display = 'none';
	divObj.innerHTML = text;
}
}

Использовать опции в теге? - Да

Замена BB-кода:

<div>
<div style="cursor: pointer; color: #847441; font-size: 12px; font-family: Verdana, Tahoma, Helvetica, sans-serif; text-decoration: none" onclick="show_hide_text(this,'{option}')">{option}</div>
<div style="display: none">
{content}
</div>
</div>

Ссылка на комментарий
Поделиться на других сайтах

  • 2 месяца спустя...
А как можно приделать к началу надписи в {options} небольшое изображение? Картинку 7х7 "+", когда текст скрыт и "-", когда открыт - как в эксплорере на свёрнутый и развёрнутый список файлов.
Ссылка на комментарий
Поделиться на других сайтах

И вот ещё что заметил - в "версии для печати" и в "текстовой версии" всё выглядит плохо. Нет полного текста, которого хотелось бы, чтобы выводился по умолчанию. Выводится, соответственно, сжатый. То есть, надо отдельно править шаблоны для этих HTML. Причём "текстовая версия" задумывалась как самый упрощённый вариант, чуть ли не для телнета - то есть там скриптов вроде и не должно быть. С этим ничего поделать нельзя?
Ссылка на комментарий
Поделиться на других сайтах

  • 4 недели спустя...
А у меня он не хочет показываться :D

Да, у меня тоже не показывался сначала, а потом до меня дошло что нада путь к скрипту ставить только jscripts/expand.js

Ссылка на комментарий
Поделиться на других сайтах

  • 2 месяца спустя...

Скажите что не так сделано?

Форум 2.3

 

При посте сообщения со скрытым тексом, надпись "открыть" отображается верно, после нажатия отображается "undefined (скрыть)" при закрытии сообщения "undefined"

Ссылка на комментарий
Поделиться на других сайтах

Скажите что не так сделано?

Форум 2.3

 

При посте сообщения со скрытым тексом, надпись "открыть" отображается верно, после нажатия отображается "undefined (скрыть)" при закрытии сообщения "undefined"

В "версии для печати" и в lo-fi версии тоже бы этого хотелось. Без правки кода самого движка.

Ссылка на комментарий
Поделиться на других сайтах

Выложите пожалуйста целый код с картинками + и -, ну и разумееться с {option}.

И ещё желательно что бы когда курсор наводишь на картинку она выделялась как ссылка.

Ссылка на комментарий
Поделиться на других сайтах

Присоединиться к обсуждению

Вы можете ответить сейчас, а зарегистрироваться позже. Если у вас уже есть аккаунт, войдите, чтобы ответить от своего имени.

Гость
Ответить в этой теме...

×   Вы вставили отформатированный текст.   Удалить форматирование

  Допустимо не более 75 смайлов.

×   Ваша ссылка была автоматически заменена на медиа-контент.   Отображать как ссылку

×   Ваши публикации восстановлены.   Очистить редактор

×   Вы не можете вставить изображения напрямую. Загрузите или вставьте изображения по ссылке.

Зарузка...

×
×
  • Создать...

Важная информация

Находясь на нашем сайте, вы соглашаетесь на использование файлов cookie, а также с нашим положением о конфиденциальности Политика конфиденциальности и пользовательским соглашением Условия использования.