zaraizar
@zaraizar
Я только-только приоткрываю дверь в IT

Как прикрутить плагин ElevateZoom-Plus?

Добрый день!

Хочу прикрутить к странице JQuery плагин ElevateZoom-Plus. вроде выполняю все их инструкции (, Gallery & Lightbox), но не работает, хоть ты тресни...

Мой код:

<img id="img_01" src="../../img/bijoux/broche/small/broche_001_01_small.jpg" data-zoom-image="../../img/bijoux/broche/broche_001_01.jpg"/>
 
    <div id="gallery_01">
    
        <a href="#" data-image="../../img/bijoux/broche/small/broche_001_01_small.jpg" data-zoom-image="../../img/bijoux/broche/broche_001_01.jpg">
            <img id="img_01" src="../../img/bijoux/broche/small/broche_001_01_small.jpg"/>
        </a>
    
        <a href="#" data-image="../../img/bijoux/broche/small/broche_002_01_small.jpg" data-zoom-image="../../img/bijoux/broche/small/broche_002_01.jpg">
            <img id="img_01" src="../../img/bijoux/broche/small/broche_002_01_small.jpg"/>
        </a>
    
        <a href="#" data-image="../../img/bijoux/broche/small/broche_003_01_small.jpg" data-zoom-image="../../img/bijoux/broche/small/broche_003_01.jpg">
            <img id="img_01" src="../../img/bijoux/broche/small/broche_0013_01_small.jpg"/>
        </a>
    
        <a href="#" data-image="../../img/bijoux/broche/small/broche_004_01_small.jpg" data-zoom-image="../../img/bijoux/broche/small/broche_004_01_small.jpg">
            <img id="img_01" src="../../img/bijoux/broche/small/broche_004_01_small.jpg"/>
        </a>
    
    </div>


/*set a border on the images to prevent shifting*/
#gallery_01 img {
    border: 2px solid white;
}
 
/*Change the colour*/
.active img {
    border: 2px solid #333 !important;
}


<script>
    //initiate the plugin and pass the id of the div containing gallery images
$('#zoom_03').ezPlus({
    gallery: 'gallery_01', cursor: 'pointer', galleryActiveClass: 'active',
    imageCrossfade: true, loadingIcon: 'http://www.elevateweb.co.uk/spinner.gif'
});
 
//pass the images to Fancybox
$('#zoom_03').bind('click', function (e) {
    var ez = $('#zoom_03').data('ezPlus');
    $.fancyboxPlus(ez.getGalleryList());
    return false;
});
  </script>


В JQuery прикрутил и ссылку на сам ElevateZoom-Plus тоже.

В итоге превьюшки появляются, изображение, котрое должно быть больим принимает размер превьюешек (что, в общем, неудивительно - стоит изображение маленького размера). Почему ни требуют загружать маленькое ихображение? Совсем непонятно...

И сам скрипт не работает - можно мышкой дыру в мониторе протереть, ни фига ничего не увеличивается...

Что я делаю не так?
  • Вопрос задан
  • 60 просмотров
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы