Как сделать несколько спойлеров в одну строку

Arhangel 14.05.2012 спойлер, как сделать, dle faq Все вопросы » Общие вопросы по вёрстке 6637

вопрос

У меня к вам такой вопрос: Как сделать несколько спойлеров в одну строку?
Например как тут:

Ответил: Sander

Это не спойлеры, а табы.
Есть очень хороший скипт табов
Но в принципе можете использовать любой другой скрипт.

3 комментария

Юзер

Barsik - 2015-04-1317 мая 2012 02:28 - #5001

Еще один вариант... Когда-то где-то нарыл — не помню.
Поскольку в DLE уже реализованы табы (например, на их основе создана форма добавления новости через админпанель и т.д.), то в принципе подключение jQuery-скрипта к движку необязательно — tabs.js есть в системе изначально. Особенно если табы нужны время от времени, а не постоянно их использовать где только можно.

Для того чтобы на DLE сделать табы — не нужно абсолютно никаких телодвижений и установок. Просто когда надо их применить — вставляем в нужное место, например в новость, нижеприведенный код — подлиннее, зато ничего не надо подключать. Стилистика оформления правится прямо здесь же на свой вкус если есть необходимость.

<script type="text/javascript" src="engine/skins/tabs.js"></script>
<!-- К файлу скрипта желательно прописать абсолютный путь  через хттп -->
<div id="dle_tabView1">
<div class="dle_aTab" style="display:none;">
СОДЕРЖИМОЕ ПЕРВОЙ ВКЛАДКИ
</div>
<div class="dle_aTab" style="display:none;">
СОДЕРЖИМОЕ ВТОРОЙ ВКЛАДКИ
</div>
<div class="dle_aTab" style="display:none;">
СОДЕРЖИМОЕ ТРЕТЬЕЙ ВКЛАДКИ
</div>
<div class="dle_aTab" style="display:none;">
СОДЕРЖИМОЕ ЧЕТВЕРТОЙ ВКЛАДКИ
</div>
</div>
<script type="text/javascript">
initTabs('dle_tabView1',Array('НАЗВАНИЕ-1','НАЗВАНИЕ-2','НАЗВАНИЕ-3','НАЗВАНИЕ-4'),0, '100%',0);
<!-- Заменяем на свои оригинальные названия вкладок -->
</script>
<style type="text/css">
    .dle_tabPane{
        height:26px;    /* Height of tabs */
    }
    .dle_aTab{
        border:1px solid #CDCDCD;
        padding:5px;        
        
    }
    .dle_tabPane DIV{
        float:left;
        padding-left:3px;
        vertical-align:middle;
        background-repeat:no-repeat;
        background-position:bottom left;
        cursor:pointer;
        position:relative;
        bottom:-1px;
        margin-left:0px;
        margin-right:0px;
    }
    .dle_tabPane .tabActive{
        background-image:url('engine/skins/images/tl_active.gif');
        margin-left:0px;
        margin-right:0px;    
    }
    .dle_tabPane .tabInactive{
        background-image:url('engine/skins/images/tl_inactive.gif');
        margin-left:0px;
        margin-right:0px;
    }

    .dle_tabPane .inactiveTabOver{
        margin-left:0px;
        margin-right:0px;
    }
    .dle_tabPane span{
        font-family:tahoma;
        vertical-align:top;
        font-size:11px;
        line-height:26px;
        float:left;
    }
    .dle_tabPane .tabActive span{
        padding-bottom:0px;
        line-height:26px;
    }
    
    .dle_tabPane img{
        float:left;
    }
</style>

Юзер

117

wcw2007 - 2015-04-1327 августа 2012 12:34 - #6763

display none это плохо

Админ

3457

ПафНутиЙ - 2015-04-1327 августа 2012 12:55 - #6766

text-indent: -9999px;
или

position: absolute;
top: -9999px;
left: -9999px;

как вариант. Но покажите пруф, где написано, что display:none; в табах плохо)

Каков вопрос - таков и ответ. Просто помните об этом.

TeraMoune | В комментариях неверно выводится чекбокс ... ¹

TeraMoune
В комментариях неверно выводится чекбокс. Как поправить?
23-03-2025, 15:41

Поправить можно при помощи CSS, смотреть в стандартном шаблоне либо открыть страницу https://dle-news.ru/templates-changelog.html и посмотреть изменения относительно вашей прошлой версии и тех до которых вы обновиляете. Стили относящиеся этого вопроса находятся в Изменения между версиями 17.2 и 17.3.
TeraMoune | Как сменить тему TinyMCE?
TeraMoune
Как сменить тему TinyMCE?
17-03-2025, 06:34
```
if( typeof tinymce === 'object' ) {
	tinymce.get().forEach((item) => {

		if( this.isDarkTheme() ) item.contentDocument.activeElement.classList.add('dle_theme_dark');
		else item.contentDocument.activeElement.classList.remove('dle_theme_dark');
	
	});
}
```
Вместо this.isDarkTheme() использовать то, что используется у вас для определения или установления факта тёмной темы.

Для применения тёмной темы панели кнопок необходимо установить html тегу класс dle_theme_dark
TeraMoune | Как вывести кнопку добавления статическо ... ¹

TeraMoune
Как вывести кнопку добавления статической страницы на сайт с модерацией ?
13-03-2025, 16:33

Таких возможностей не предусмотрено как и модерации этого типа страниц.
tarantino1 | Адаптация Kylshop 5.3 для DLE 15 ¹¹

tarantino1
Адаптация Kylshop 5.3 для DLE 15
13-03-2025, 15:35

помогите плиз, модуль не появился в админке, или как в админку зайти? кто-то выше спрашивал какие теги у него, их нигде в сети нет, но я нашёл его сайт на веб архив и вот основные теги ниже.
Общие теги
{cart} - выводит мини-корзину на странице. Данный тег можно не указывать, при этом плагин сам вставит корзину в конец html документа. При этом должен присутствовать обязательный стандартный тег DLE {AJAX}
По умолчанию стили фиксируют корзину справа вверху. Вы можете переписать стили в своем файле стилей, во избежание затирания стандартных стилей при обновлении плагина.
{filter} - выводит на страницу фильтр товаров.
Работает с реальными ценами, без учета скидок. В дальнейших обновлениях сделаю настройку включения или отключения учета скидок.
{map} - выводит карту, которая отвечает за пункты доставки.
{balance} - выводит баланс пользователя.
{addBalance} - выводит форму для пополнения баланса.
Теги для shortstory.tpl и fullstory.tpl (custom.tpl)
{add-cart} - выводит кнопку добавления товара в корзину.
{go-payment} - выводит кнопку моментального перехода на страницу оформления заказа.
{counter} - выводит поле, для выбора количества шт.
{product} - выводит содержимое, которое забито в поле (после оплаты | вкладка магазин).
{price} - реальная цена товара.
{price-sale} - цена с учетом скидки.
{sale} - скидка.
{sale-type} - тип скидки (знак валюты или знак процента).
{currency} - знак валюты.
{filter} - выводит свойства (фильтры) данного товара. В дальнейшем это будет называться свойства.
{count} - выводит количество позиций товара.
{count-orders} - количество проданных позиций.
Условные:
[price] содержимое [/price] - будет выводиться содержимое, если цена задана
[sale] содержимое [/sale] - будет выводиться содержимое, если скидка задана
[not-price] содержимое [/not-price] - отобразит содержимое, если цены нет
[not-sale] содержимое [/not-sale] - отобразит содержимое, если скидки нет
[related-goods] содержимое [/related-goods] - отображает содержимое, если похожие товары заданы
[present]<span class="present">+1 в подарок</span>[/present] - отображает label, если сейчас счастливые часы.
Теги для userinfo.tpl
{my_goods} - выводит список заказов пользователя в виде таблицы.
Теги для /kylshop/cart.tpl
- страница оформления заказа.
{cart} - корзина выбранных товаров в виде таблицы.
{total} - контейнер для общей суммы в корзине.
{without-sale} - контейнер с отображением общей суммы с учетом скидки.
{method} - выпадающий список (методы).
{method-total} - цена за метод.
{without-method} - общая сумма из корзины включая цену за метод.
{form} - форма заказа созданная в админ-панели плагина.
{map} - карта с пунктами доставки.
{promo-code} - поле для ввода промо-кода.
Дополнительные теги
{ pay="315|Индивидуальный товар" } - выведет кнопку с названием индивидуальный товар с ценой 315.
{ pay="Оплатить" } - выведет поле для ввода суммы и кнопку с названием оплатить.
Теги выведены с пробелами, потому что они заменяются на кнопки. Вы вводите теги без пробелов.
TeraMoune | MySQL установил Dle Forum V.3.5 и бд выд ... ¹

TeraMoune
MySQL установил Dle Forum V.3.5 и бд выдает ошибку,что поправить?
11-03-2025, 01:23

Ошибка говорит о том, что ячейки img_id нету в таблице, что в принципе странно поскольку модуль и не создаёт таблицы с именем _forum_images. Ищите другие версии или пишите автору если он еще занимается модулем.
LMakc | Ссылка на воспроизведение аудио ? ⁴

LMakc
Ссылка на воспроизведение аудио ?
9-03-2025, 00:58

Вариант создать доп. поле [xfvalue_mp3]
bycocacola | Ссылка на воспроизведение аудио ? ⁴

bycocacola
Ссылка на воспроизведение аудио ?
2-03-2025, 15:02

Нашел вариант:
создать доп. поле, например: music
Тип поля: загружаемый аудио плейлист
и в нужном месте: [xfvalue_music audio-url="1"]
Выводит прямую ссылку на .mp3
bycocacola | Ссылка на воспроизведение аудио ? ⁴

bycocacola
Ссылка на воспроизведение аудио ?
2-03-2025, 10:55

dle 17.3
bycocacola | Ссылка на воспроизведение аудио ? ⁴

bycocacola
Ссылка на воспроизведение аудио ?
2-03-2025, 10:36

Как убрать скобки и audio=
raimikmb | Telegram Sender ¹⁶

raimikmb
Telegram Sender
27-02-2025, 09:28

Когда ожидать адаптацию под php 8.2 ???