javascript

У меня есть код ниже:

Развернуть/свернуть:

$(".post-toc").stop(true).animate({width:'toggle'}, 200);

Когда я нажимаю кнопку TOC, оглавление будет расширено. Но эффект расширения/свертывания довольно уродлив.

Я всего лишь новичок, так что не могли бы вы, ребята, помочь мне сделать расширение / свертывание более эффектным, как эффект слайда, ...?

Большое вам спасибо, ребята.

Thuat Nguyen 27 Окт 2019 в 21:58

Что вы подразумеваете под тихо уродливым? Это потому, что текст перемещается внутри оглавления во время анимации?

–

zgood

27 Окт 2019 в 22:17

Да сэр. и я не знаю, как это имеет эффект слайда, например, текст, оглавление перемещается справа налево.

–

Thuat Nguyen

27 Окт 2019 в 22:21

Попробуйте добавить этот стиль CSS в свой codepen nav[data-toggle="toc"] { width: 250px; } и посмотрите, поможет ли это тексту перемещаться.

–

zgood

27 Окт 2019 в 22:25

Я не знаю как, но анимация выглядит намного лучше. Большое вам спасибо, сэр.

–

Thuat Nguyen

27 Окт 2019 в 22:30

1 ответ

Попробуйте метод JQuery slideToggle().

HTML:

    <div>
        <h1>This is a heading</h1>
    </div>
    <button>Button</button>

JS:

        var action = 'click';
        var speed = 1000;
        $('button').on(action, function() {
            $('div').slideToggle(speed);
        });

craft9861 27 Окт 2019 в 22:42

Сделайте ширину JS: у переключателя красивая анимация

1 ответ

Похожие вопросы

Новые вопросы