Форум русской поддержки Joomla!® CMS
07.12.2016, 16:36:02 *
Добро пожаловать, Гость. Пожалуйста, войдите или зарегистрируйтесь.
Вам не пришло письмо с кодом активации?

Войти
   
   Начало   Поиск Joomla 3.0 FAQ Joomla 2.5 FAQ Joomla 1.5 FAQ Правила форума Новости Joomla Реклама Войти Регистрация Помощь  
Страниц: [1]   Вниз
  Добавить закладку  |  Печать  
Автор

fancybox вместо lightbox

 (Прочитано 3323 раз)
0 Пользователей и 1 Гость смотрят эту тему.
demoni
Осваиваюсь на форуме
***

Репутация: +0/-0
Offline Offline

Сообщений: 33


« : 27.09.2012, 19:08:58 »

fancybox вместо lightbox
Вопрос конечно не жизни и смерти, но можно ли как то "допилить" JoomShopping?
Записан
ELLE
Support Team
*****

Репутация: +862/-0
Offline Offline

Пол: Женский
Сообщений: 4723



« Ответ #1 : 27.09.2012, 19:11:52 »

ниче пилить не надо
отключаете Lightbox, ставите фансибокс и инициализируете плагин - всё
подробности можно узнать в доках фанси
делается от силы 10мин, если не возникнет никаких конфликтов
Записан
demoni
Осваиваюсь на форуме
***

Репутация: +0/-0
Offline Offline

Сообщений: 33


« Ответ #2 : 27.09.2012, 19:18:32 »

А где можно документацию по фанаси найти? На офф сайте не нашел.
Записан
ELLE
Support Team
*****

Репутация: +862/-0
Offline Offline

Пол: Женский
Сообщений: 4723



« Ответ #3 : 27.09.2012, 19:21:50 »

http://fancyapps.com/fancybox/
Записан
demoni
Осваиваюсь на форуме
***

Репутация: +0/-0
Offline Offline

Сообщений: 33


« Ответ #4 : 27.09.2012, 19:29:07 »

нашел функцию, которая отвечает за лайтбокс

Код:
public static function loadJsFilesLightBox(){
    static $load;
        $jshopConfig = JSFactory::getConfig();
        if (!$jshopConfig->load_jquery_lightbox) return 0;
        if (!$load){
            $document = JFactory::getDocument();
            $document->addScript(JURI::root().'components/com_jshopping/js/jquery/jquery.lightbox-0.5.pack.js');
            $document->addStyleSheet(JURI::root().'components/com_jshopping/css/jquery.lightbox-0.5.css');
            $document->addScriptDeclaration('function initJSlightBox(){
                jQuery("a.lightbox").lightBox({
                    imageLoading: "'.JURI::root().'components/com_jshopping/images/loading.gif",
                    imageBtnClose: "'.JURI::root().'components/com_jshopping/images/close.gif",
                    imageBtnPrev: "'.JURI::root().'components/com_jshopping/images/prev.gif",
                    imageBtnNext: "'.JURI::root().'components/com_jshopping/images/next.gif",
                    imageBlank: "'.JURI::root().'components/com_jshopping/images/blank.gif",
                    txtImage: "'._JSHOP_IMAGE.'",
                    txtOf: "'._JSHOP_OF.'"
                });
            }
            jQuery(function() { initJSlightBox(); });');
            $load = 1;
        }
    }


Как ее теперь переписать, что бы она вызывала фанси?
Записан
ELLE
Support Team
*****

Репутация: +862/-0
Offline Offline

Пол: Женский
Сообщений: 4723



« Ответ #5 : 27.09.2012, 19:30:21 »

версия у вас какая? у меня Lightbox в настройках магазина отключается 3.10
Записан
demoni
Осваиваюсь на форуме
***

Репутация: +0/-0
Offline Offline

Сообщений: 33


« Ответ #6 : 27.09.2012, 19:33:45 »

3.11

Отключить то я отключил, а вот как фанси поставить?
Записан
ELLE
Support Team
*****

Репутация: +862/-0
Offline Offline

Пол: Женский
Сообщений: 4723



« Ответ #7 : 27.09.2012, 19:36:32 »

index.php шаблона открываете, подключаете стили и скрипт, инициализируете плагин используя класс .lightbox
вот еще тема, может понятнее будет - http://joomlaforum.ru/index.php/topic,218144.0.html
Записан
demoni
Осваиваюсь на форуме
***

Репутация: +0/-0
Offline Offline

Сообщений: 33


« Ответ #8 : 27.09.2012, 19:54:06 »

Не понимаю, как мне сделать так, что бы JoomShopping подхватывал эффект фанси.
Записан
ELLE
Support Team
*****

Репутация: +862/-0
Offline Offline

Пол: Женский
Сообщений: 4723



« Ответ #9 : 27.09.2012, 19:57:49 »

index.php шаблона в <head>
Код:
<script src="/templates/шаблон/js/jquery.fancybox.pack.js" type="text/javascript"></script>
<link rel="stylesheet" href="/templates/шаблон/css/jquery.fancybox.css" type="text/css" />
<script type="text/javascript">
    jQuery(document).ready(function() {
 jQuery(".lightbox").fancybox({
maxWidth : 800,
maxHeight : 600,
fitToView : false,
width : '70%',
height : '70%',
autoSize : false,
closeClick : false,
openEffect : 'none',
closeEffect : 'none'
});
});
</script>
пути проверить!
Записан
demoni
Осваиваюсь на форуме
***

Репутация: +0/-0
Offline Offline

Сообщений: 33


« Ответ #10 : 27.09.2012, 20:06:08 »

Почти допилил.

Товар храниться а product_default.php вот ссылки картинок:

Код:
  <a class="lightbox" id="main_image_full_<?php print $image->image_id?>" href="<?php print $this->image_product_path?>/<?php print $image->image_full;?>" <?php if ($k!=0){?>style="display:none"<?php }?>>
                <img id = "main_image_<?php print $image->image_id?>" src = "<?php print $this->image_product_path?>/<?php print $image->image_name;?>" alt="<?php print htmlspecialchars($image->_title)?>" title="<?php print htmlspecialchars($image->_title)?>" />
            </a>

Пытаюсь переписать на ваш код (который заработал)

Код:
<a href="<?php print $product->product_link?>?tmpl=component" class="various" data-fancybox-type="iframe">Быстрый просмотр</a>
Записан
demoni
Осваиваюсь на форуме
***

Репутация: +0/-0
Offline Offline

Сообщений: 33


« Ответ #11 : 27.09.2012, 20:10:16 »

Кажется получилось, но есть еще 1 косяк, фото открывается в 1 экземпляре, а мне нужно, как в лайтбоксе в виде галереи.

Я имею ввиду, чтобы тамбуты тоже отображались, можно ли как то это сделать?
Записан
ELLE
Support Team
*****

Репутация: +862/-0
Offline Offline

Пол: Женский
Сообщений: 4723



« Ответ #12 : 27.09.2012, 20:10:33 »

зачем это все?
я уже сказала, что делать постом выше и не надо самодеятельности!
только если вам нужен этот "быстрый просмотр" - тогда все по шагам надо делать, как в той теме
Кажется получилось, но есть еще 1 косяк, фото открывается в 1 экземпляре, а мне нужно, как в лайтбоксе в виде галереи
- это в доки, там есть все примеры
Записан
demoni
Осваиваюсь на форуме
***

Репутация: +0/-0
Offline Offline

Сообщений: 33


« Ответ #13 : 27.09.2012, 20:19:45 »

Все допилил, спасибо большое ELLE!

Если кому нужно выкладываю:

В product_default.php в тег "a" добавил "rel="gallery1"

Для основного изображения
Код:
 <a class="lightbox" rel="gallery1" id="main_image_full_<?php print $image->image_id?>" href="<?php print $this->image_product_path?>/<?php print $image->image_full;?>" <?php if ($k!=0){?>style="display:none"<?php }?>>
                <img id = "main_image_<?php print $image->image_id?>" src = "<?php print $this->image_product_path?>/<?php print $image->image_name;?>" alt="<?php print htmlspecialchars($image->_title)?>" title="<?php print htmlspecialchars($image->_title)?>" />
            </a>
И остальные
Код:
<div class="manufacturer_logo">
                <a rel="gallery1" href="<?php print SEFLink('index.php?option=com_jshopping&controller=manufacturer&task=view&manufacturer_id='.$this->product->product_manufacturer_id, 2);?>">
                    <img src="<?php print $this->config->image_manufs_live_path."/".$this->product->manufacturer_info->manufacturer_logo?>" alt="<?php print htmlspecialchars($this->product->manufacturer_info->name);?>" title="<?php print htmlspecialchars($this->product->manufacturer_info->name);?>" border="0" />
                </a>
            </div>

В шаблоне добавил:

Код:
<script src="<?php echo $this->baseurl ?>/templates/ваш_шаблон/js/jquery.fancybox.pack.js" type="text/javascript"></script>
<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/ваш_шаблон/css/jquery.fancybox.css" type="text/css" />
<script type="text/javascript">
jQuery(document).ready(function() {
jQuery(".lightbox").fancybox({
maxWidth : 800,
maxHeight : 600,
fitToView : false,
width : '70%',
height : '70%',
autoSize : false,
closeClick : false,
openEffect : 'none',
closeEffect : 'none'
});
});
</script>


И в админке отключал lightbox
Записан
x-masters
Осваиваюсь на форуме
***

Репутация: +0/-0
Offline Offline

Сообщений: 76


« Ответ #14 : 30.06.2015, 16:39:45 »

Советую активировать функцию FitToView - она не дает изображению уйти за границы экрана. Я на Fancy только из-за этого перешел, т.к. на адаптивном дизайне разрешения устройств сильно различаются и litebox все время уходит за пределы видимости. Ну и эффектов закрытия и открытия тоже не хватает. Вот как выглядит последний код для index.php шаблона у меня:
Код:
<script src="<?php echo $this->baseurl ?>/templates/ваш_шаблон/js/jquery.fancybox.pack.js" type="text/javascript"></script>
<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/ваш_шаблон/css/jquery.fancybox.css" type="text/css" />
<script type="text/javascript">
jQuery(document).ready(function() {
jQuery(".lightbox").fancybox({
maxWidth : 1000,
maxHeight : 800,
fitToView : true,
autoSize : true,
closeClick : true,
openEffect : 'elastic',
closeEffect : 'elastic'
});
});
</script>
« Последнее редактирование: 30.06.2015, 17:10:59 от x-masters » Записан
diana1975
Осваиваюсь на форуме
***

Репутация: +1/-0
Offline Offline

Сообщений: 134


« Ответ #15 : 11.02.2016, 22:40:31 »

не хочу открывать новую тему: решила  вместо  Lightbox  использовать в карточке товара     fancybox, надеялась, что он адаптирован под мобильные устройства, а именно: картинка увеличивается при клике или раздвиж. пальцев до реальных размеров большого фото. Но fancybox вмещает картинку в пределах экрана, а  родной Lightbox увеличивает ее как надо, но ее можно передвигать пальцами только вертикально, а слева направо ни в какую. Какое решение можете предложить?
Записан
dmitry_stas
Профи
********

Репутация: +798/-4
Online Online

Сообщений: 7770



« Ответ #16 : 11.02.2016, 23:37:10 »

думаю это зависит не от Lightbox а от конкретно вашей адаптивной верстки
Записан
diana1975
Осваиваюсь на форуме
***

Репутация: +1/-0
Offline Offline

Сообщений: 134


« Ответ #17 : 12.02.2016, 00:16:48 »

Через CSS убила все ограничители натурального размера картинки, зашла в инструменты->веб-разработка-> адаптивный дизайн - показывает все как надо,  а в айфоне и андроиде ничего не изменилось.
Что не так?
ссылка
Записан
dmitry_stas
Профи
********

Репутация: +798/-4
Online Online

Сообщений: 7770



« Ответ #18 : 12.02.2016, 01:13:52 »

ну как я и сказал это вопрос не Lightbox. если у вас для body
Код
overflow-x: hidden;
задано, то о каком тягании горизонтально может идти речь? Azn
Записан
Brooksus
Завсегдатай
*****

Репутация: +152/-0
Offline Offline

Пол: Мужской
Сообщений: 598


Ща спою...


« Ответ #19 : 12.02.2016, 11:05:33 »

У вас теперь еще и ошибка будет из-за того, что вы отключили lightbox - Uncaught ReferenceError: initJSlightBox is not defined
Что бы этого не было можно прописать function initJSlightBox(){};

Мне больше Magnific Popup нравится. Пример вот - http://brooksite.demojoomla.com/index.php/kategorii/cars/coupe
« Последнее редактирование: 12.02.2016, 11:42:38 от Brooksus » Записан
diana1975
Осваиваюсь на форуме
***

Репутация: +1/-0
Offline Offline

Сообщений: 134


« Ответ #20 : 12.02.2016, 17:10:53 »

спасибо за совет, Brooksus, перешла на  Magnific Popup, пока норм.
Записан
Страниц: [1]   Вверх
  Добавить закладку  |  Печать  
 
Перейти в:  

Powered by SMF 1.1.21 | SMF © 2006, Simple Machines

Joomlaforum.ru is not affiliated with or endorsed by the Joomla! Project or Open Source Matters.
The Joomla! name and logo is used under a limited license granted by Open Source Matters
the trademark holder in the United States and other countries.

LiveInternet