Как сделать выезжающий чат?

Question

[Александр Коновалов]

Здравствуйте! Как сделать такой чат - https://csgoup.com? (prntscr.com/ctswp0, prntscr.com/ctswtg)
Чтобы он выезжал справа?

Answer 1

[Lam Besis]

Уточните ваш вопрос.
Если у вас есть подобный чатик, который нужно сделать выезжающим, то это проставив связка (CSS Transitions + 5-строчный скрипт отлавливающий клик по кнопке "чат").
Другое дело, если вам нужно непосредственно этот сайт написать и заставить работать. Что именно вам нужно?

Comments

[Александр Коновалов]

Lam Besis вёрстка чата. Сделать просто блок, который выезжает по нажатию справа окна

[Александр Коновалов]

Lam Besis CSS Transitions + 5-строчный скрипт отлавливающий клик по кнопке "чат" - вот это нужно

[Lam Besis]

Александр Коновалов: тогда вот вам схема:
1. Верстайте блок, фиксируйте его у края окна.
.chat {
position: fixed;
right: -350px; (в зависимости от того какой ширины ваш блок, разумеется. Вам нужно задать отрицательное значение чтобы блок был скрыт за пределами экрана и видна была только кнопка вызова)
transition: all 1s linear; (этим мы говорим что изменять свойства блока нужно плавно) }
Потом создаёте доп. класс
.is-active {
right: 0; }
И пишите небольшой скрипт, с похожим условием:
(".кнопка").по клику { (".чат").добавить клиссс ("is-active")