Сообщений в теме: 6

[Apoca1ypto]

Добрый вечер!

 

Подскажите как можно сделать с помощью JBZoo Image или JBZoo Gallery следующее.

Нужна popup галерея, но на странице должно отображаться лишь одно изображение (первое), если по нему кликнуть то уже открывается popup галерея, где можно пролистать все остальные изображения. JBZoo Image и JBZoo Gallery позволяют сделать popup галерею, но для этого они отображают все миниатюры на странице, а нужна только одна.

 

Спасибо!

[Cheren-dow]

Apoca1ypto, доброго времени суток. Скройте через CSS все не нужные изображения и выводите только одно

[Apoca1ypto]

Apoca1ypto, доброго времени суток. Скройте через CSS все не нужные изображения и выводите только одно

Если не сложно, подскажите, к чему привязать стили.
Сейчас решил сделать через JBZoo Gallery, указав точный размер картинки в div и добавив атрибут overflow: hidden.

[Cheren-dow]

Что бы подсказать что то по CSS нужна ссылка на сайт. Можете ее выложить?

[Apoca1ypto]

Отправил в ЛС.

[Cheren-dow]

Apoca1ypto, сделайте следующее. Откройте шаблон элемента галереи

сайт\media\zoo\applications\jbuniversal\elements\jbgallery\tmpl\jbgallery.php 

И замените все содержимое на

<?php
/**
 * JBZoo App is universal Joomla CCK, application for YooTheme Zoo component
 *
 * @package     jbzoo
 * @version     2.x Pro
 * @author      JBZoo App http://jbzoo.com
 * @copyright   Copyright (C) JBZoo.com,  All rights reserved.
 * @license     http://jbzoo.com/license-pro.php JBZoo Licence
 * @coder       Denis Smetannikov <denis@jbzoo.com>
 */

// no direct access
defined('_JEXEC') or die('Restricted access');

$this->app->jbassets->fancybox();
$i = 0;
?>

<div id="<?php echo $galleryId; ?>">

    <?php foreach ($thumbs as $thumb) { ?>

        <a href="<?php echo $thumb['img']; ?>"
           rel="<?php echo $rel; ?>"
           title="<?php echo $thumb['name']; ?>"
           class="jbgallery <?php echo ($i == 0) ? ' first' : ''; ?>"><img src="<?php echo $thumb['thumb']; ?>"
                                  alt="<?php echo $thumb['name']; ?>"
                                  title="<?php echo $thumb['name']; ?>"
                                  width="<?php echo $thumb['thumb_width']; ?>"
                                  height="<?php echo $thumb['thumb_height']; ?>"
                /></a>

    <?php $i++; } ?>

    <div class="clear clr"></div>
</div>

<script type="text/javascript">
    jQuery(function ($) {
        $('#<?php echo $galleryId; ?> .jbgallery').fancybox({
            helpers: {
                "title"  : { type: "outside" },
                "buttons": { position: "top" },
                "thumbs" : { width: 80, height: 80 },
                "overlay": { locked: false}
            }
        });
    });
</script>

Теперь для перво изображения будет добавляться класс first

 

Через CSS скрываем все изображения

.jbzoo-app-portfolio .items .jbzoo-item-teaser .jbgallery{
	display: none;
}

А первое показываем

.jbzoo-app-portfolio .items .jbzoo-item-teaser .jbgallery.first {
	display: inline;
}

Должно работать, не проверял

[Apoca1ypto]

Все работает, спасибо!

Думаю эту опцию стоит добавить в стандартные настроки элемента.