Лайтбокс, отражения фото и смена фото с помощью плагина YOOeffects

Плагины Joomla


Здравствуйте дорогие друзья и любители Joomla. Хочу рассказать о плагине под названием YOOeffects от команды YooTheme. Все статьи о плагинах вы можете почитать в разделе Плагины Joomla. Плагин позволяет без проблем подключить к сайту Лайтбокс, отражения фото и смена фото. Все что нужно для этого это установить плагин YOOeffects и вставлять соответствующий код. Этот плагин дает классные эффекты которые выделит ваш сайт с фона остальных сайтов. YOOeffects плагин обеспечивает простую интеграцию лайтбокс, отражения и Spotlight функцию в любой шаблон. Функция Lightbox позволяет показывать всплывающие окна наложения каких-либо медиа-контента на страницу, которую вы просматриваете, а не со ссылками на новом окне. Он основан на Shadowbox и поддерживает все самые популярные веб-форматы, включая изображения, QuickTime, Windows Media Player, Flash, Flash Video, и даже внешние веб-страницы. Этот плагин позволяет легко добавить эти привлекательные эффекты для ваших сайтов на Joomla.

Лайтбокс, отражения фото и смена фото с помощью плагина YOOeffects

Лайтбокс, отражения фото и смена фото с помощью плагина YOOeffects

Лайтбокс, отражения фото и смена фото с помощью плагина YOOeffects

Каждый эффект который входит в комплект плагина может работать и включатся по отдельности, что очень хорошо, вить не всегда нужен например эффект смены цвета на фото. В настройках плагин прост как 5 копеек, нужен эффект включил его, не нужен выключил.

Настройки lightbox,reflection,spotlight от YOOeffects

Как вы видите из скрина,я ни чего не скрывал о настройках. А теперь применить эти эффекты:

Применить эффект lightbox на ваше содержание

Добавить REL = «Shadowbox» атрибут к любой ссылки, чтобы активировать функцию lightbox.

Например:

<a href= «image.jpg» rel= «shadowbox» title= «my caption» >image #1</a>

Вы также можете установить отдельную ширину и высоту лайтбокс с помощью использования следующих параметров внутри rel-тега:

<a href= «image.jpg» rel= «shadowbox;width=300;height=200» title= «my caption» >image #1</a>

Если у вас есть набор связанных изображения, которые вы хотели бы соединить в группу, выполните первый шаг, но дополнительно включает имя группы в квадратных скобках в rel тег:

<a href="image-1.jpg" rel="shadowbox[a]">image #1</a>

<a href="image-2.jpg" rel="shadowbox[a]">image #2</a>

Применить эффект spotlight (смена цвета) на ваше содержание

Создать DIV или span элемент с фоновым изображением (image.png) для отображения изображений в содержании. Добавить класс = «Spotlight» атрибут DIV / span тега. Имя файла связанные изображения при наведении эффект называть его имени с суффиксом _spotlight (image_spotlight.png) и должен быть в той же папке, фоновое изображение (image.png).

Пример:

<div class="spotlight" style="background: url(images/logo.png); width: 240px; height: 180px;"></div><!--<pre-->

<p>Пример для span tag:</p>
<pre class="brush:php"><span class="spotlight" style="background: url(images/logo.png); display: block; width: 240px; height: 180px;"></span>

</pre>

Применить эффект reflection (отображения) на ваше содержание

YOOreflection позволяет добавлять отражения эффекты для ваших изображений в современных браузерах. Этот шаблон включает Reflection.js для MooTools который является улучшенной версией оригинального сценария Reflection.js. Так что вам не нужно тратить время в графическом редакторе создания отражений.

YOOreflections могут быть добавлены к любому изображению над любой фон (даже изображение рабочего стола!). Добавить class=»reflect» атрибут к любому изображению тега.

Пример:

<img class = «reflect» title= «my caption» src= «image.jpg» width= «240» height= «180» />

Плагин YOOeffects действительно эффектен, он присутствовал в моей 5 отличных плагинов в статье 5 отличных плагинов для сайта на Joomla. Более подробную информацию. а также скачать плагин YOOeffects вы можете на офф сайте команды YooTheme здесь.

Если вы живете в Киеве и ищите организацию по месту расположения, тогда карта Киева от Maplos поможет Вам.

На этом статья Лайтбокс, отражения фото и смена фото с помощью плагина YOOeffects. Желаю что б ваш сайт был эффектным и незабываемым. Увидимся.

Nauca – научись работать с Joomla

Не пропусти ничего полезного,подпишись:

  • Egor

    А видео как подсоединять?

    • Аноним

      к ссылке на видео добавить rel= “shadowbox”

  • Kira

    Подскажите, пожалуйста, а как в этот код вставить лайтбокс?
    «Тут был код»

    Пробовала разными способами — ничего не получается.

    • Kira, по идеи вам нужно добавить к тегу , но если он не заработает, то это означает что плагин YOOeffects обрабатывает тег только в тексте, а не в коде.