Форум

Эдди · #1 (**permalink**) 24.09.2013, 01:41

Уважаемые господа-товарищи (кому как нравится).

Есть скрипт, который открывает див.
Как изменить его, чтобы и закрывал еще, пожалуйста.
Плюс чтобы не по клику по диву открывался и закрывался (хотя я это и сам мог бы сделать), а отдельной ссылкой: Открыть/закрыть.

<html>
    <head>
        <title>Changer</title>
        <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
    </head>
    <body>
        <a href="">Развернуть</a>
        <div style="height: 30px; overflow:hidden; background-color:green;">
            а<br/>
            б<br/>
            в<br/>
            г<br/>
            д<br/>
            е<br/>
            ж<br/>
            з<br/>
            и<br/>
            к<br/>
            л<br/>
            м<br/>
            н<br/>
        </div>
        <script type="text/javascript">
            $('a').click(function () {
                // console.log($(this)[0].scrollHeight);
                $(this).animate({height: $(this)[0].scrollHeight}, 500);
            });
        </script>
    </body>
</html>

Эдди · #2 (**permalink**) 24.09.2013, 01:43

И еще прошу совета.
jQery все же лучше устанавливать у себя или на стороне брать?
Читал, что сторонний лучше, поскольку он в кеше будет, если южер уже подобные страницы посещал.

рони · #3 (**permalink**) 24.09.2013, 02:32

Эдди,

<!DOCTYPE HTML>
<html>
    <head>
        <title>Changer</title>
        <meta charset="utf-8">
        <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
    </head>
    <body>
        <a href="">Открыть/закрыть</a>
        <div style="height: 30px; overflow:hidden; background-color:green;">
            а<br/>
            б<br/>
            в<br/>
            г<br/>
            д<br/>
            е<br/>
            ж<br/>
            з<br/>
            и<br/>
            к<br/>
            л<br/>
            м<br/>
            н<br/>
        </div>
        <script type="text/javascript">
            $('a').click(function () {
                var next =  $(this).next(),
                height = next.height() <  next[0].scrollHeight ?  next[0].scrollHeight : '30px';
                next.stop().animate({'height': height}, 500);
                return false;
            });
        </script>
    </body>
</html>

Эдди · #4 (**permalink**) 25.09.2013, 22:49

Спасибо!

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

Ну да ладно.

Эдди · #5 (**permalink**) 26.09.2013, 14:23

Прошу прощения. Руки кривые. Вопрос удален

Форум

Справочник

Discord чат

Курсы javascript