freekir
4/6/2015 - 3:07 PM

Спойлер

Спойлер

slide.html
content_copyfile_download
<!DOCTYPE HTML>
<html lang="en-US">
<head>
    <meta charset="UTF-8">
    <title>Спойлер</title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $('.slide-hide').hide();
            $('.slide_link').click(function () {
                if ($(this).parent()[0].nodeName == 'TD') {
                    $(this).parent().parent().next().show().find('.slide-hide').slideToggle('fast');
                } else {
                    $(this).parent().next('.slide-hide').slideToggle('fast');
                }
            });
        });
</script>

<style>
    .slide_link{ color: #666666; border-bottom: 1px dashed #666666; position: relative; overflow: hidden; }
    .slide_link:hover{ 	border-bottom: 1px dashed #ededed; 	cursor: pointer; }
</style>
</head>
<body>
<p><span class="slide_link">Блок откройся</span></p>

<div class="slide-hide">
    <p>Тут контент раскрывающегося блока контент раскрывающегося блока контент раскрывающегося блока контент
        раскрывающегося блока контент раскрывающегося блока контент раскрывающегося блока контент раскрывающегося блока
        контент раскрывающегося блока контент раскрывающегося блока контент раскрывающегося блока контент
        раскрывающегося блока контент раскрывающегося блока контент раскрывающегося блока контент раскрывающегося блока
        контент раскрывающегося блока контент раскрывающегося блока контент раскрывающегося блока контент
        раскрывающегося блока контент раскрывающегося блока контент раскрывающегося блока контент раскрывающегося блока
        контент раскрывающегося блока контент раскрывающегося блока контент раскрывающегося блока контент
        раскрывающегося блока контент раскрывающегося блока
    </p>
</div>
</body>
</html>