ElevateZoom錯誤 - $（...）elevateZoom不是一個函數

我現在遇到了一個錯誤：

jquery.elevatezoom.js:39 

Uncaught TypeError: $(...).elevateZoom is not a function(anonymous function) @ jquery.elevatezoom.js:39

線39+有關的一切是：

//initiate the plugin and pass the id of the div containing gallery images 
$(".zoom").elevateZoom({gallery:'gal1', cursor: 'pointer', galleryActiveClass: 'active', imageCrossfade: true, loadingIcon: 'http://www.elevateweb.co.uk/spinner.gif'}); 

//pass the images to Fancybox 
$(".zoom").bind("click", function(e) { 
    var ez = $('.zoom').data('elevateZoom');  
    $.fancybox(ez.getGalleryList()); 
    return false; 
});

上午什麼我錯過了？

的CSS線（也許我想念事端出來）：

/*set a border on the images to prevent shifting*/ 
#zoom img{border:2px solid white;} 

/*Change the colour*/ 
.active img{border:2px solid #333 !important;} 
The single change in the main php file is the 'isset' to' null ! == '

主要代碼：

<div class="product_image"> 
    <?php 
     $href = url_for($product->getRouteUrl(ESC_RAW)); 
     if ($sf_context->getActionName() == 'view') 
    { 
     $href = static_url_for($product->generatePhotoPath('large',ESC_RAW)); 
    } 
    ?> 

    <a <?php echo $sf_context->getActionName() == 'view' ? 'class="lightbox"' : ''; ?> href="<?php echo $href;?>" title="<?php echo $product; ?>"> 
     <img src="<?php echo static_url_for($product->generatePhotoPath(ESC_RAW)); ?>" alt="<?php echo $product; ?>" data-zoom-image="<?php echo static_url_for($product->generatePhotoPath('large',ESC_RAW)); ?>" class="zoom" style="z-index:999999;" /> 
    </a> 

    <?php if(null !==($product->generatePhotoPath("medium", ESC_RAW))){ ?> 
    <div id="gal1"> 

    <a href="#" data-image="<?php echo url_for($product->generatePhotoPath("medium", 1, ESC_RAW)); ?>" data-zoom-image="<?php echo url_for($product->generatePhotoPath("large", 1, ESC_RAW)); ?>"> 
    <img id="img_01" src="<?php echo url_for($product->generatePhotoPath("medium", 1, ESC_RAW)); ?>" /> 
    </a> 

    <?php } ?> 

    <a href="#" data-image="<?php echo url_for($product->generatePhotoPath("medium", 2, ESC_RAW)); ?>" data-zoom-image="<?php echo url_for($product->generatePhotoPath("large", 2, ESC_RAW)); ?>"> 
    <img id="img_01" src="<?php echo url_for($product->generatePhotoPath("medium", 2, ESC_RAW)); ?>" /> 
    </a> 

    <a href="#" data-image="<?php echo url_for($product->generatePhotoPath("medium", 3, ESC_RAW)); ?>" data-zoom-image="<?php echo url_for($product->generatePhotoPath("large", 3, ESC_RAW)); ?>"> 
    <img id="img_01" src="<?php echo url_for($product->generatePhotoPath("medium", 3, ESC_RAW)); ?>" /> 
    </a> 

</div> 
</div> 

<script src="/js/elevatezoom/jquery.elevatezoom.js" type="text/javascript"></script>

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

以下 '圖庫&燈箱' 的說明

來源

2016-09-22 BeanA22

你在哪裏加載你的JS相對於你的HTML？確保jQuery在你的插件之前被加載，並且你在調用elevateZoom（縮放綁定）時會在加載插件（以及dom準備就緒）後加載。 – noahnu

非常肯定，插件沒有加載。您可以嘗試在頁面加載後在控制檯中輸入$(".zoom").elevateZoom({gallery:'gal1', cursor: 'pointer', galleryActiveClass: 'active', imageCrossfade: true, loadingIcon: 'http://www.elevateweb.co.uk/spinner.gif'});

並查看是否得到相同的錯誤。如果不是，那麼你需要在準備好的呼叫內（例如至少其他線路）包裝線路39上的代碼，例如，

$(document).ready (function() { $(".zoom").elevateZoom({gallery:'gal1', cursor: 'pointer', galleryActiveClass: 'active', imageCrossfade: true, loadingIcon: 'http://www.elevateweb.co.uk/spinner.gif'}); });

來源

2016-09-22 20:09:04 Steve

ElevateZoom錯誤 - $（...）elevateZoom不是一個函數

回答

相關問題