Сворачивание/разворачивание ифнормации

[AlexSPB]

Добрый день, пытаюсь настроить в информации сворачивание/разворачивание.

 

Есть заголовок "Доставка по Москве" и ниже инфа. Нужно чтобы по умолчанию инфа была в свернутом виде, чтобы можно было кликнуть на "Доставка по Москве" и инфо развернулось бы.

Делаю так

<details> <summary>Доставка по Москве</summary></details>

появляется стрелочка, но инфо не сворачивается/разворачивается.

 

Подскажите как настроить? И можно ли добавить кроме стрелочки другой символ?

[Seriusis]

Вы не с той стороны зашли. Использовать можете любые теги, в принципе, но сворачивание/разворачивание делается через js, либо инструментарий bootstrap https://getbootstrap.com/docs/4.5/components/collapse/#accordion-example 

 

Вам может помочь решить данную задачу мой модуль 

 

[fanatic]

<style>
    #text{
       display:none;
    }
</style>
<script>
$(function(){
    $('#show-hide').click(function(){
        let t = $(this).data('text');
        let tt = $(this).text();
        
        $(this).text(t);
        $(this).data('text', tt);
        
        $("#text").slideToggle({
            duration: 'slow',
            easing: 'linear'
        });
                
    })
})
                
</script>
 
<p>Содержание <span data-text="[скрыть]" id="show-hide">[открыть]</span></p>
 
<p id="text">hello world</p>

 

[AlexSPB]

4 часа назад, Seriusis сказал:

Вам может помочь решить данную задачу мой модуль 

спасибо.

[AlexSPB]

@fanatic 

спасибо за код, я думал будет проще)) Я не смог отобразить инфо так как мне нужно, со стилями.

[Tom]

Здесь на форуме валяется очень давно  дополнение со скриптом readmore. По сути можно взять сам скрипт, подключить в хидере и далее сделать в любом текстовом редакторе то что рекомендует автор.