Ответ 1
На всякий случай никто не нашел решение, вот способ сделать это. Вам нужно будет использовать fancybox вместо lightbox и elevatezoom. Вы можете найти их по следующим ссылкам:
http://fancyapps.com/fancybox/#license
http://www.elevateweb.co.uk/image-zoom/download
После того, как вы скачали это, добавьте различные плагины в заголовке (или в нижней части тела для более быстрой загрузки), ваш заголовок должен выглядеть следующим образом:
<link rel="stylesheet" type="text/css" href="css/jquery.fancybox.css" />
<script type="text/javascript" src="js/jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="js/jquery.fancybox.pack.js"></script>
<script type="text/javascript" src="js/jquery.elevateZoom-3.0.8.min.js"></script>
Сразу после jquery.fancybox добавьте следующее:
<style type="text/css">
.zoomContainer { z-index: 100000; }
</style>
Это исправление, поэтому контейнер масштабирования отображается над фактическим fancybox.
Добавьте класс .fancybox
в ссылки, обертывающие ваши изображения.
Затем добавьте следующее после разных скриптов:
<script type="text/javascript">
$(document).ready(function() {
$(".fancybox").fancybox({
afterShow: function() {
$('.fancybox-image').elevateZoom({
zoomType : "lens",
lensShape : "round",
lensSize : 200
});
}
});
});
</script>
Затем вы должны иметь линзу, работающую с fancybox!