В отличие от joomla 1.5 в 1.6 SqueezeBox в IE6 отображается правильно, в joomla 1.5 он выводился в верхней части страницы.
Как использовать лайтбокс можно посмотреть на странице проекта SqueezeBox.
Добавляется SqueezeBox с помощью функции:
<?php JHTML::_('behavior.modal'); ?>
libraries\joomla\html\html\behavior.php
public static function modal($selector = 'a.modal', $params = array())
По умолчанию на странице выбираются все ссылки с классом modal
$selector = 'a.modal'
Дополнительные параметры:
ajaxOptions handler fullScreen parseSecure closable closeBtn iframePreload iframeOptions size shadow onOpen onClose onUpdate onResize onMove onShow onHide
Этот код добавляет на страницу следующий js:
<script type="text/javascript">
window.addEvent('domready', function() {
SqueezeBox.initialize({});
SqueezeBox.assign($$('a.modal'), {
parse: 'rel'
});
});
</script>
Содержание в IFrame
<a href="http://mootools.net" class="modal" rel="{handler:'iframe',size:{x:840,y:550}}">
MooTools.net in a box!
</a>
Также в атрибут rel можно добавлять другие параметры для SqueezeBox. Например, onClose.
<a href="http://mootools.net" class="modal" rel="{handler:'iframe',size:{x:840,y:550}, onClose:update}">
MooTools.net in a box!
</a>
После закрытия лайтбокса, будет выполнена функция update(), которая, к примеру, будет обновлять страницу с которой открывался лайтбокс.
Открыть html-элемент:
<a class="modal" href="#demo-target-clone" rel="{handler:'adopt', size:{x:840,y:550}}">Ссылка на html-элемент</a>
#demo-target-clone - id html элемента
После клика по ссылке элемент будет удален.
Чтобы можно было его повторно вызывать нужно использовать код без handler:'adopt'
<a class="modal" href="#demo-target-clone" rel="{size:{x:840,y:550}}">Ссылка на html-элемент</a>