Question

我使用Joomla 3.4.3 和Virtuemart 3.0.9.4

在我的产品详细信息页面上，将显示主图片和其他图片。如果单击其他图像，则相应地更改主图片。缩放功能在主画面中工作并准备就绪。

当我点击其他图像并且主图像相应地改变时，例如黄色钢笔，但仍然是缩放窗口中显示的默认图像（蓝色钢笔）。

我认为产品分配存在问题或类似问题。图像 - ＆GT; fileURL。

这是我网站的链接： My Webseite - Productdetails - Zoom

你们有没有提出解决方案。

我的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>

我的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>

谢谢

Mike Buchholz

附加图像缩放 - 问题 - 提升缩放脚本

0 个答案: