Плагін jce mediabox - створення спливаючих вікон

Сьогодні ми з Вами розглянемо:

Плагін jce mediabox - створення спливаючих вікон

Налаштування плагіна JCE MediaBox

Плагін jce mediabox - створення спливаючих вікон

Ці ж параметри можна налаштовувати і через "Менеджер плагінів" - в списку плагінів знаходимо "System - JCE MediaBox", клікнувши по якому відкриється вікно з настройками плагіна JCE MediaBox.

Плагін jce mediabox - створення спливаючих вікон

  • Тема спливаючого вікна - вибір теми показу спливаючого зображення (Standart, Squeeze, Shadow, Light.) За замовчуванням варто "standart" і цю тему можна залишити.
  • Шлях до значка - відносний шлях до файлів іконок для JCE Mediabox.

Налаштування спливаючого вікна:

Плагін jce mediabox - створення спливаючих вікон

Плагін jce mediabox - створення спливаючих вікон

Налаштування підказки

Плагін jce mediabox - створення спливаючих вікон

  • Клас спливаючих підказок - ім'я класу використовуваного для стилю підказки
  • Прозорість підказки - коефіцієнт прозорості фону підказки (0 = прозорий, 1 = непрозорий)
  • Швидкість відображення підказки - швидкість появи вікна підказки в мілісекундах
  • Положення підказки - положення підказки щодо курсора миші (зверху-ліворуч, зверху-праворуч, зверху-в_центре, знизу-зліва, знизу-справа, знизу-в_центре)
  • Зсув по X - зміщення підказки по осі X в пікселях щодо курсора миші
  • Зсув по Y - зміщення підказки по осі Y в пікселях щодо курсора миші

На цьому з настройками JCE MediaBox ми закінчимо, не забудьте зберегти настройки, і розглянемо як його використовувати на практиці.

Як створити спливаюче вікно із зображенням по текстовому посиланню


Відкривається модальне вікно в якому є 3 вкладки.

Плагін jce mediabox - створення спливаючих вікон

Плагін jce mediabox - створення спливаючих вікон

Вищевказані поля не обов'язкові до заповнення.

Вкладка "Спливаючі вікна" - саме в ній ми будемо створювати спливаючі вікна з зображеннями і медіа-контентом.

Плагін jce mediabox - створення спливаючих вікон

У вкладці "Спливаючі вікна" вибираємо зі списку JCE MediaBox Popups.

Плагін jce mediabox - створення спливаючих вікон

Заповнюємо поля "Назва" і "Тема" для спливаючого вікна.
"Група" поки не заповнюємо, воно служить для створення спливаючих вікон групи (галереї).
"Іконка" - вкл / викл показ користувачеві зображення з маленькою лупою, яка підказує, що за посиланням відкриється спливаюче вікно. Виберемо "Так".
"Позиція іконки" - в випадаючому списку вибираємо в якому місці відображати іконку з підказкою.
"Розміри" - вказуємо ширину і висоту спливаючого вікна в пікселях, для зображення заповнювати необов'язково.
"Авто-вікна" - спливаючі вікна будуть автоматично відкриватися при завантаженні сторінки на основі обраного параметра:
Одинарні - откритьза одну сесію браузера.
Постійні - відкривати спливаючі вікна постійно при переході по сторінках.
"Приховати посилання вспл. Вікна" - приховує посилання спливаючих вікон і дочірніх елементів. Корисно при створенні галереї зображень з одного посилання.
"Тип медіа" - вказуємо який тип медіа ми хочемо відображати у спливаючому вікні: внутрішню посилання, зовнішнє посилання, Youtube Video, Vimeo Video, IFrame, ролик на Adobe Flash, Audio mp-3, Video mp-4, Windows Media Player і ін .
В полях "Ім'я" і "Значення" можна вказати інформацію, яка буде з'являтися знизу спливаючого вікна.
Після заповнення всіх вкладок натискаємо кнопку "Вставити".

Як створити ефект спливаючого вікна (Lightbox) зображення

Плагін jce mediabox - створення спливаючих вікон

підказки

Плагін jce mediabox - створення спливаючих вікон

У спливающем вікні в полі "Тема" пишемо текст нашої підказки і вибираємо "Клас" - jcetooltip.

Плагін jce mediabox - створення спливаючих вікон

Натискаємо кнопку "Оновити" і після оновлення сторінки сайту ми бачимо підказки при наведенні курсору на потрібне слово.

Спливна галерея зображень в JCE

За допомогою JCE MediaBox можна створити галерею зображень, коли відкриваєш одну картинку і за допомогою стрілок можна переглядати такі зображення.
Зробити це просто. Створимо для прикладу ще одну картинку для спливання. І в обох посилань в поле "Група" напишемо однакову назву групи латиницею або цифрами. Я записав gruppa.

Плагін jce mediabox - створення спливаючих вікон

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

Таким обазом до одній картинці можна прив'язати галерею з картинок, які можна переглядати за допомогою стрілок.

Плагін jce mediabox - створення спливаючих вікон
Плагін jce mediabox - створення спливаючих вікон
Плагін jce mediabox - створення спливаючих вікон

У наступній статті я Вам розповім про найбільш зручному для додавання спливаючих зображень плагін JCE Image Manager Extended.

Добрий день. Я не зрозумів як за допомогою цього плагіна зробити спливаюче вікно, яке буде з'являтися при відкритті сайту?


Для цього в настройках спливання JCE MediaBox є спеціальне поле Авто-вікна. У цьому налаштуванні є 2 типу:

Добрий день. Підкажіть будь ласка, чи можливо зробити затримку появи автоматично спливаючого вікна?