Есть ли у Bootstrap анимации выезжания блока справа или слева? А если что не так моим с jQuery?

Question

[Lorem Ipsum]

В общем-то хочу сделать анимацию "выезда" блока с правой стороны сайта + во время анимации у него opacity (непрозрачность) ставится в 1. "Выезжает" блок при нажатии на , а "заезжает" обратно пр нажатии на место снаружи этого блока (я реализовал через событие клика на body). Сколько ни рылся в документации по Bootstrap так ничего не нашёл.
Поэтому решил реализовать через jQuery, однако постоянно срабатывает клик на body. И блок "заезжает" обратно после того как "приехал".

$(document).ready(function() {
        $("#showWindow").click(function() {
            $("#window").animate({
                left: 0,
                opacity: 1
            })
        });
        $(document.body).click(function() {
            $("#window").animate({
                left: "-65%",
                opacity: 0
            })
        });
    });

Как сделать так, чтобы он не уезжал после того как приехал?

Answer 1

[Дима Паутов]

$("#showWindow").click(function(event) {
event.stopPropagation();

            $("#window").animate({
                left: 0,
                opacity: 1
            })
        });

Comments

[Lorem Ipsum]

Подскажите, пожалуйста, ещё один момент. Мне нужно скрывать блок CSS-свойством: display: none. Когда я нажимаю на "скрыть", то блок сразу пропадает (display: none;), а мне нужно, чтобы он плавно уходил в прозрачность (opacity: 0;), а потом при конце анимации блок уходил в display: none;

[Дима Паутов]

fadeIn() - fadeOut()

[MrakCw]

ImpAnonym, возьми фреймворк MD Bootstrap в место обычного Bootstrap.

Там сразу из коробки доступно 70+ анимаций.

Я буквально на прошлых выходных свой темплейт перевел как выше написал, заняло всего около часа с учётом всех правок.

Или можно ещё отдельно подключить библиотеку с анимациями