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不是一个函数

回答

相关问题