Untitled

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Test</title>
        <script src="https://code.jquery.com/jquery-2.1.0.min.js" integrity="sha256-8oQ1OnzE2X9v4gpRVRMb1DWHoPHJilbur1LP9ykQ9H0=" crossorigin="anonymous"></script>
        <script>
        var halfText = $('.spoiler').innerHeight() / 2,
            textHeight = $('.spoiler').innerHeight();
        $('.spoiler').css('height', $('.spoiler').innerHeight() / 2);
        $('.show-hide').click(function() {
            if( $('.spoiler').innerHeight() == halfText ) {
                $('.spoiler').animate({ height: textHeight }, 500);
                $(this).text('Скрыть');
            } else {
                $('.spoiler').animate({ height: halfText }, 500);
                $(this).text('Показать');
            }
        });
        </script>
    </head>
    <body>
        <style>
        .spoiler {
            width: 30%;
            overflow: hidden;
        }
        </style>

        <div class="container">
            <div class="spoiler">
                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Magni optio provident! Ipsum quibusdam neque amet sapiente quod libero ducimus ipsa possimus totam voluptatem nemo ex expedita sequi voluptatum rerum corrupti.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Magni optio provident! Ipsum quibusdam neque amet sapiente quod libero ducimus ipsa possimus totam voluptatem nemo ex expedita sequi voluptatum rerum corrupti.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Magni optio provident! Ipsum quibusdam neque amet sapiente quod libero ducimus ipsa possimus totam voluptatem nemo ex expedita sequi voluptatum rerum corrupti.</p>
            </div>
            <button class="show-hide">Показать</button>
        </div>
    </body>
</html>