Объединение плагина Swinxyzoom с Fancybox в Wordpress

Question

Я пытаюсь активировать плагин Swinxyzoom Wordpress (который использует jQuery, чтобы пользователь мог увеличить часть изображения) в лайтбокс Fancybox на быстродействующем веб-сайте.

После того, как в контакте с плагином автора Swinxyzoom, он мотивационные следующее:

Для интеграции SwinxyZoom с лайтбокса вам нужно будет создать некоторые пользовательский код, который срабатывает, когда Lightbox закончил отображение его содержание, например. В fancybox это событие «onComplete».

На этом этапе вам нужно обернуть содержание изображения осветителя с якорным тегом ориентацией большого полного изображения, а затем инициализируют swinxyzoom в $ (элемент) .swinxyzoom();

Любая помощь была бы высоко оценена!

Тестовая страница сайта, на котором я использовал оба указанных выше плагинов индивидуально является http://www.mcemcourses.org/radiology-test

Answer 1

Основываясь на информации, которую вы предоставили, этот код должен сделать трюк:

<script type='text/javascript'> 
jQuery.noConflict(); 
jQuery(document).ready(function ($) { 
    jQuery('a.myfancybox').fancybox({ 
     'zoomSpeedIn': 500, 
     'zoomSpeedOut': 500, 
     'overlayShow': true, 
     'overlayOpacity': 0.3, 
     'onComplete': function() { 
      $("#fancybox-img").wrap("<a class='myZoom' href='http://www.mcemcourses.org/wp-content/uploads/9-Orbital-floor-.jpg' />"); 
      $("a.myZoom").swinxyzoom({ 
       mode: 'lens' // or your preferred mode 
      }); 
     } 
    }); 
}); 
</script> 

Уведомление, что вы будете нуждаться в 3 изображения:

• ноготь большого пальца, то один вы щелкаете открыть FancyBox.
• Изображение среднего размера, которое вы нацеливаете на ссылку href ссылки, которая открывает fancybox, и фактически изображение, открытое в fancybox.
• Изображение большого размера, которое вы установили в href оберточного анкера внутри обратного вызова onComplete.

Также обратите внимание, что селектор #fancybox-img относится к открытому изображению в fancybox только для v1.3.x.

ПРИМЕЧАНИЕ: Самые популярные плагины fancybox WordPress используют v1.3.4.

См JSFIDDLE