Висувається панель з будь-якого боку, дизайн і розробка сайту

Доброго вам дня!
Іноді на сайті потрібно організувати такий блок, який не повинен займати місце "Попереду" але бути завжди під рукою. Наприклад вікно зворотного зв'язку або "контакти", вікно для входу в особистий кабінет, в загальному все що спочатку має бути прихованим. Ідея полягає в тому, що справа / зліва вгорі / внизу буде кнопка, при натисканні на яку буде висуватися панель. І так - приступимо.

Можете подивитися приклад:

1. Підключення бібліотек jQuery

Для роботи скрипта, необхідно підключити бібліотеку jQuery перед закривається тегом

Якщо у Вас вже підключалася бібліотека раніше для роботи якогось іншого скрипта, то пропустіть цей крок для уникнення конфліктів і порушення роботи інших скриптів.

2. Підключення скрипта панелі

Створіть файл, наприклад panel.js і вставте в нього наступний код:

На початку скрипта рядки, в яких можна налаштувати поява.
Далі підключаємо даний файл відразу після підключення бібліотеки.

3. Вставка HTML коду

Далі вставляємо десь (де Вам зручніше) після тега

Наступного код html:

4. Стилі CSS

Для настройки панелі яка з'явиться після натискання кнопки використовуйте наступний код CSS:

Якщо ви все зробили правильно, то у Вас з'явиться результат. Також можете завантажити вихідні.

На цьому все. Дякую за увагу 🙂

Думаю, якщо захотіти, то зробити можна. Поки цим питанням не займався, може з часом зроблю панель з таким ефектом. Вам можливо підійде ось така панель, правда вона з'являється при прокручуванні, а не з затримкою.

Привіт дорогий друже

У тебе встановлено розширення AdBlock або подібне. Додай мій сайт в білий список, і тим самим внесеш свій внесок в його розвиток. Інструкція як відключити AdBlock Хочу й собі віконце