Additional Image Zoom - Issue

[mkb-buerokonzepte.de]

Hello ,

I've been using a private ElevateZoom Zoom scripts.

I'm Using Joomla 3.4.3
and Virtuemart 3.0.9.4

http://www.elevateweb.co.uk/image-zoom/examples

On my product detail page, the main picture and the additional images will be displayed. If you click on an additional image changes accordingly the main picture. The zoom function works in the main picture and ready.

When I click on an additional image and the main image changes accordingly in eg a yellow fountain pen but still the default image (blue fountain pen) displayed in the Zoom window.

I guess that there is a problem are or the like with the allocation of the product-> images

• > fileURL.
  
  Here is a Link to my Website:
  

  http://mkb-buerokonzepte.de/schule-buero-schreibwaren/fueller-fuellfederhalter/f%C3%BCller-lamy-detail.html

  
  Did any of you a proposed solution.
  
  My default_images.php:
  

  <?php
  /**
  *
  * Show the product details page
  *
  * @package   VirtueMart
  * @subpackage
  * @author Max Milbers, Valerie Isaksen
  
  * @link http://www.virtuemart.net
  * @copyright Copyright (c) 2004 - 2010 VirtueMart Team. All rights reserved.
  * @license http://www.gnu.org/copyleft/gpl.html GNU/GPL, see LICENSE.php
  * VirtueMart is free software. This version may have been modified pursuant
  * to the GNU General Public License, and as distributed it includes or
  * is derivative of works licensed under the GNU General Public License or
  * other free or open source software licenses.
  * @version $Id: default_images.php 8508 2014-10-22 18:57:14Z Milbo $
  */
  // Check to ensure this file is included in Joomla!
  defined('_JEXEC') or die('Restricted access');
  if(VmConfig::get('usefancy',1)){
     vmJsApi::addJScript( 'fancybox/jquery.fancybox-1.3.4.pack', false);
     vmJsApi::css('jquery.fancybox-1.3.4');
     $document = JFactory::getDocument ();
     $imageJS = '
     jQuery(document).ready(function() {
        Virtuemart.updateImageEventListeners()
     });
     Virtuemart.updateImageEventListeners = function() {
        jQuery("a[rel=vm-additional-images]").fancybox({
           "titlePosition"    : "inside",
           "transitionIn"   :   "elastic",
           "transitionOut"   :   "elastic"
        });
        
  
   
        jQuery(".additional-images a.cms-additional-images").removeAttr("rel");
        jQuery(".additional-images img.cms-image-hover").click(function() {
           jQuery(".additional-images a.cms-additional-images").attr("rel","vm-additional-images" );
           jQuery(this).parent().children("a.cms-additional-images").removeAttr("rel");
           var src = jQuery(this).parent().children("a.cms-additional-images").attr("href");
           jQuery(".main-image img").attr("src",src);
           jQuery(".main-image img").attr("alt",this.alt );
           jQuery(".main-image a").attr("href",src );
           jQuery(".main-image a").attr("title",this.alt );
           jQuery(".main-image .vm-img-desc").html(this.alt);
        });
     }
     ';
  } else {
     vmJsApi::addJScript( 'facebox',false );
     vmJsApi::css( 'facebox' );
     $document = JFactory::getDocument ();
     $imageJS = '
     jQuery(document).ready(function() {
        Virtuemart.updateImageEventListeners()
     });
     Virtuemart.updateImageEventListeners = function() {
        jQuery("a[rel=vm-additional-images]").facebox();
        var imgtitle = jQuery("span.vm-img-desc").text();
        jQuery("#facebox span").html(imgtitle);
     }
     ';
  }
  vmJsApi::addJScript('imagepopup',$imageJS);
  
  if (!empty($this->product->images)) {
     $image = $this->product->images[0];
     ?>
     
  
  
     <div class="main-image">
      <meta itemprop="image" content="<?php echo  JURI::base().$this->product->images[0]->file_url_thumb; ?>">
        <?php echo $image->displayMediaFull("id='zoom_01'",true,"rel='vm-additional-images'"); ?>
        
     </div>
     <?php
  }
  ?>
  
  
  
  
  <script type="text/javascript">
     
     //initiate the plugin and pass the id of the div containing gallery images
    $("#zoom_01").elevateZoom({gallery : "gal1", galleryActiveClass: "active", zoomWindowFadeIn: 500, zoomWindowFadeOut: 500, lensFadeIn: 500, lensFadeOut: 500, tint:true, tintColour:'#083B6A', tintOpacity:0.5 });
     $("#zoom_01").bind("click", function(e) { var ez = $('#zoom_01').data('elevateZoom');   $.fancybox(ez.getGalleryList()); return false; });
  </script>
  

  
  
  
  My default_images_additional.php:
  
  

  <?php
  /**
  *
  * Show the product details page
  *
  * @package   VirtueMart
  * @subpackage
  * @author Max Milbers, Valerie Isaksen
  
  * @link http://www.virtuemart.net
  * @copyright Copyright (c) 2004 - 2010 VirtueMart Team. All rights reserved.
  * @license http://www.gnu.org/copyleft/gpl.html GNU/GPL, see LICENSE.php
  * VirtueMart is free software. This version may have been modified pursuant
  * to the GNU General Public License, and as distributed it includes or
  * is derivative of works licensed under the GNU General Public License or
  * other free or open source software licenses.
  * @version $Id: default_images.php 7784 2014-03-25 00:18:44Z Milbo $
  */
  // Check to ensure this file is included in Joomla!
  defined('_JEXEC') or die('Restricted access');
  ?>
  
  <div class="additional-images floatleft" style="width:80px; margin: 0;">
  <div id="mkb_jcarousel" class="jcarousel-skin-cmsmart">
  <div class="jcarousel-container jcarousel-container-vertical" style="position: relative; display: block;">
  <div id="gal1" class="jcarousel-clip jcarousel-clip-vertical" style="position: relative;height: 350px;overflow:hidden; width:80px;">
  
  <?php
     $start_image = VmConfig::get('add_img_main', 1) ? 0 : 1;
     for ($i = $start_image; $i < count($this->product->images); $i++) {
        $image = $this->product->images[$i];
        ?>
          <ul id="CMS-images" class="jcarousel-list" style="position: relative; overflow: hidden;">
        <li class="jcarousel-item jcarousel-item-vertical jcarousel-item-1 jcarousel-item-1-vertical" style="float:left; list-style:outside none">
           <?php
           if(VmConfig::get('add_img_main', 1)) {
              echo $image->displayMediaThumb('class="cms-image-hover" height="auto" width="70px" style="cursor: pointer"',false,$image->file_description);
              echo '<a href="'. $image->file_url .'"  class="cms-additional-images image-'. $i .'" title="'. $image->file_meta .'"></a>';
           } else {
              echo $image->displayMediaThumb("",true,"rel='vm-additional-images'",true,$image->file_description);
           }
           ?>
        </li>
          </ul>
     <?php
     }
     ?>
  
  
  <!--<div class="jcarousel-prev jcarousel-prev-vertical"></div>
  <div class="jcarousel-prev jcarousel-next-vertical"></div>-->
  </div>
  </div>
  </div>
     <div class="clear"></div>
  </div>
  
          <div class="clear"></div>
  
  
  

[jenkinhill]

You should ask the supplier of your zoom plugin about this.  See http://forum.virtuemart.net/index.php?topic=108212.0

[mkb-buerokonzepte.de]

You should ask the supplier of your zoom plugin about this.  See http://forum.virtuemart.net/index.php?topic=108212.0

Okay I contact times the Plugin Support