Приветствую уважаемое сообщество! На странице одно изображение при клике на нем открывается Галерея с Fancybox
Помогите добавить Зум при наведении - т.есть соединить вместе
Fancybox и
jqzoom.
Fancybox работает, а при наведении на картинку увеличение - jqzoom-а не хочет.
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
<script type="text/javascript" src="/js/fancybox/lib/jquery.mousewheel-3.0.6.pack.js"></script>
<link rel="stylesheet" href="/js/fancybox/source/jquery.fancybox.css?v=2.0.4" type="text/css" media="screen"/>
<script type="text/javascript" src="/js/fancybox/source/jquery.fancybox.pack.js?v=2.0.4"></script>
<link rel="stylesheet" href="/js/fancybox/source/helpers/jquery.fancybox-buttons.css?v=2.0.4" type="text/css" media="screen"/>
<script type="text/javascript" src="/js/fancybox/source/helpers/jquery.fancybox-buttons.js?v=2.0.4"></script>
<link rel="stylesheet" href="/js/fancybox/source/helpers/jquery.fancybox-thumbs.css?v=2.0.4" type="text/css" media="screen"/>
<script type="text/javascript" src="/js/fancybox/source/helpers/jquery.fancybox-thumbs.js?v=2.0.4"></script>
<script src="/js/jqzoom/js/jquery.jqzoom-core.js" type="text/javascript"></script>
<link rel="stylesheet" href="/js/jqzoom/css/jquery.jqzoom.css" type="text/css"/>
{literal}
<script type="text/javascript">
$(document).ready(function()
{
$("a.fancybox").fancybox({
'cyclic': false,
'padding': 10,
'margin-down':0,
'margin-left':2,
'margin-right':2,
'margin-top':20,
'opacity': true,
'speedIn': 200,
'speedOut': 300,
'changeSpeed': 100,
'overlayShow': true,
'overlayOpacity': "0.3",
'overlayColor': "#666666",
'titleShow': true,
'titlePosition': 'inside',
'enableEscapeButton': true,
'showCloseButton': true,
'showNavArrows': true,
'hideOnOverlayClick': true,
'hideOnContentClick': false,
'transitionIn': "elastic",
'transitionOut': "elastic",
'scrolling': "yes",
'centerOnScroll': true,
'autoScale': true,
'onComplete': function() {
$('a.fancybox').jqzoom({
zoomType: 'innerzoom',
title: false,
lens: false,
showEffect: 'fadein',
hideEffect: 'fadeout'
});
}
});
});
</script>
{/literal}
<a href="/uploads/codecs/codecs_1.jpg" rel="g1" class="fancybox"> <img src="/uploads/codecs/codecs_1s.jpg" alt=""/></a> <a href="/uploads/codecs/codecs_2.jpg" rel="g1" class="fancybox"></a> <a href="/uploads/codecs/codecs_3.jpg" rel="g1" class="fancybox"></a>
