| tenebrosus |
30.01.2014 16:00 |
ZoomSL vs Fancybox
Доброго настроения!
Задача: зум картинки плагином ZoomSL и возможность увеличения плагином FancyBox.
То есть при наведении зум, при клике- увеличение. Частично получилось- зум точно работает.
А увеличение- только если быстро кликнуть при загрузке.. Я очень начинающий программер,
к тому же PHP, а в JS и вовсе "не бум бум".. Может надо onComplete как-то повесить на zoomSL
чтобы при завершении подгружался FancyBox?
Код:
<head>
<script src="js/jquery-1.8.3.min.js"></script>
<script src="js/zoomsl-3.0.min.js"></script>
<script src="fancybox/jquery.fancybox-1.3.1.pack.js"></script>
<link rel="stylesheet" href="fancybox/jquery.fancybox-1.3.1.css" type="text/css" media="screen" />
</head>
<body>
<script>
jQuery(function(){
$('.my-foto').imagezoomsl({
zoomrange: [3, 3] ,
});
});
</script>
<script type="text/javascript">
$(document).ready(function() {
$('.catalog-detail-images').fancybox({
'transitionIn': 'elastic',
'transitionOut': 'elastic',
'speedIn': 600,
'speedOut': 200,
'overlayShow': false,
'cyclic' : true,
'padding': 20,
'titlePosition': 'over',
'type' : 'image',
'onComplete': function() {
$("#fancybox-title").css({ 'top': '100%', 'bottom': 'auto' });
}
});
});
</script>
<a href="images/1.jpg" class="catalog-detail-images"><img src="images/2.jpg" class="my-foto" width="300" height="300" /></a>
</body>
|
