ElevateZoomエラー - $（...）elevateZoomは、私は次のエラーに遭遇してる機能

Question

ではありません：。

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のライン（多分私はmissinのsomethin出てる）：

/*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

から 'ギャラリー&ライトボックス' からの指示に従っています

Answer 1

プラグインがロードされていないことは間違いありません。ページが読み込まれた後、同じエラーが発生した場合は、$(".zoom").elevateZoom({gallery:'gal1', cursor: 'pointer', galleryActiveClass: 'active', imageCrossfade: true, loadingIcon: 'http://www.elevateweb.co.uk/spinner.gif'});

と入力してみてください。そうでない場合は、回線39上のコードをレディーコールの中にラップする必要があります。あなたがHTMLに比べて、あなたのJSをロードしている

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