Раскрывает и скрывает SEO-текст при клике на кнопку Подробнее

Раскрывает и скрывает SEO-текст при клике на кнопку Подробнее

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

<div class="b-mp_seo">

        <div class="b-mp_seo_text">

           Long long text ...

        </div>

    </div>
    <div class="b-mp_seo_hide">

    </div>
    <div class="b-mp_seo_hide_bnt">
        <a href="javascript:void(0)">Подробнее</a>
    </div>
    <style>
        .b-mp_seo {
            height: 105px;
            overflow: hidden;
        }

        .b-mp_seo_hide{
            height: 30px;
            background: #ffffffab;
            position: relative;
            top: -20px;
        }
        .seo_text_show{
            height: auto !important;
            overflow: visible !important;
            margin-bottom: 20px;
        }
    </style>
    
    
    <script>
       $(".b-mp_seo_hide_bnt a").on("click", function() {
        var $this = $(this);
        var $content = $(".b-mp_seo");
        var $hide_block = $(".b-mp_seo_hide");
        var linkText = $this.text().toUpperCase();

        if(linkText === "ПОДРОБНЕЕ"){
            linkText = "Скрыть";
            $hide_block.toggle();
            $content.toggleClass( "seo_text_show" );
        } else {
            linkText = "Подробнее";
            $hide_block.toggle();
            $content.toggleClass( "seo_text_show" );
        }

        $this.text(linkText);

    })
    </script>

Контакты

Звоните, пишите, обсудим ваши задачи