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

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

Решено: Virt 2.6.10+ reel js - вращение товара 360 градусов из серии снимков

 (Прочитано 680 раз)
0 Пользователей и 1 Гость смотрят эту тему.
mmi1973
Захожу иногда
**

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

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



« : 04.10.2014, 12:36:18 »

Ранее публиковал пост о вращении товара на основе swf. Для ознакомления - опыт по внедрению вращения товара 360 градусов в последнюю версию VirtueMart. Итак - в качестве основы выбрал темплейт VISTE. Начало работы - стандартное - введение дополнительного поля в админке VirtueMart в карточку редактирования товара. Поставил задачу сохранят стандартное фото file_ur, если нет серии снимков для этого товара. Через это же поле выводятся бейджи 1 Хит, 2-Новинка и под цифру 3 заточил активацию просмотра в 360 град в карточке товара с лицевой части сайта. Фото товара залил в папку product, которую создал в папке шаблона VISTE. Название папки товара с серией снимков совпадает с артикулом этого товара. Таким образом выдается одно фото file_url если нет снимков для вращения.

Далее - пациент файл default_images в папке productdetails. Прилагаю фрагмент кода - который собственно и подключает скрипт вращения и отвечает за логику работы с фото в карточке товара:

// Product Main Image
if (!empty($this->product->images[0])) {
   $imagesrcmain = YTTemplateUtils::resize($this->product->images[0]->file_url, '350', '360', 'stretch');
?>
   
<div >
            <script type="text/javascript" src="<?php echo $templateDir.'/js/jquery.reel.js' ?>"></script>
         
<div >
            <?php if ($this->product->product_beige==3) {?>
            <div style="float: center;">
   <div style="float: center;">
   <img src="<?php echo $templateDir.'/product/' ?><?php echo $this->product->product_sku;?>/001.jpg" width="610" height="387"
      class="reel"  
   id="activeImage"
      data-images="<?php echo $templateDir.'/product/' ?><?php echo $this->product->product_sku;?>/###.jpg|001..050"
     data-clickfree="true"
     data-draggable="true"
     data-wheelable="true"
      data-frame="1"
      data-speed="0.3"
     data-timeout="3">   </div>

     </div>

            <?php }
            else {?>
      <a id="yt_cloudzoom" href="<?php echo JURI::base().$this->product->images[0]->file_url;?>" class ="cloud-zoom" rel="zoomWidth:'200',zoomHeight:'150',position:'right', adjustX:20, adjustY:-3, tint:'#FFFFFF', softFocus:1, smoothMove:5, tintOpacity:0.8"  >
         <img class="img-large" src="<?php echo $imagesrcmain;?>" title="" alt="" />
      </a>
      <div class="popup-btn">
            <a id="yt_popup" data-rel="prettyPhoto" href="<?php echo JURI::base().$this->product->images[0]->file_url; ?>"><i class="icon-search"></i></a>
        </div>         
            
            <?php } ?>
</div>
         <div class="clear"></div>
</div>
   
   
<?php }
// Product Main Image END ?>

Все. Буду признателен за объективную критику и предложения.
Знакомтесь
P/S. Для ознакомления целый раздел http://www.626240.ru/index.php/poleznye-stati
Конкретный товар - http://www.626240.ru/index.php/poleznye-stati/lazernyj-printer-hp-laserjet-p1102-ce651a-detail
« Последнее редактирование: 08.08.2015, 11:11:09 от mmi1973 » Записан
borro
Живу я здесь
******

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

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


желаю вам счастья


« Ответ #1 : 24.07.2015, 11:01:13 »

Здравствуйте

Большое спасибо, что пролили немного света на эту тему.

Есть вопросы и пожелания.

Пожелания - вставить рабочие ссылки на пример реализации

Вопросы:
1. Что лучше swf или поворот картинок, если смотреть со всесторонней позиции(индексация, совокупный размер графических файлов, время загрузки страницы,...)? Такое ощущение что поворот кучи картинок скриптом более подходящее решение
2. Почему картинки вы здесь решили сохранять в папку шаблона вместо обычной папки картинок VirtueMart?
3. Код:
Код:
<a id="yt_cloudzoom" href="<?php echo JURI::base().$this->product->images[0]->file_url;?>" class ="cloud-zoom" rel="zoomWidth:'200',zoomHeight:'150',position:'right', adjustX:20, adjustY:-3, tint:'#FFFFFF', softFocus:1, smoothMove:5, tintOpacity:0.8"  >
         <img class="img-large" src="<?php echo $imagesrcmain;?>" title="" alt="" />
      </a>
Выводит изображение при наведении на которое возникает приближенный участок изображения?
4. Код:
Код:
<div class="popup-btn">
<a id="yt_popup" data-rel="prettyPhoto" href="<?php echo JURI::base().$this->product->images[0]->file_url; ?>"><i class="icon-search"></i></a>
</div>
для чего служит?
Записан
Страниц: [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