_image_gallery.php
2.02 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
<div class="kites-slider-wr">
<a id="prew"></a>
<a id="next"></a>
<div id="demo5" class="scroll-img">
<ul id="gallery">
<?php $i=0; foreach($model->getGallery() as $image): ?>
<li class="small_items">
<a href="<?= $model->minImg($image, 'original'); ?>" title="" data-options="thumbnail: '<?= $image ?>'" class="thumbnail">
<img id="logos-<?= $i++;?>" src="<?= $image; ?>" alt="" >
</a>
</li>
<?php endforeach; ?>
</ul>
</div>
</div>
<!--<div class="kites-slider-wr">-->
<!-- <a id="prew"></a>-->
<!-- <a id="next"></a>-->
<!-- <div id="demo5" class="scroll-img">-->
<!-- <ul style="width: 1500px;">-->
<!-- --><?php //$i=0; foreach($model->getGallery() as $image):?>
<!-- <li><img id="logos---><?//= $i++;?><!--" src="--><?//=$image?><!--"></li>-->
<!-- --><?php //endforeach; ?>
<!-- </ul>-->
<!-- </div>-->
<!--</div>-->
<script type="text/javascript">
$(function() {
$('.thumbnail').iLightBox(
{
skin: 'metro-black',
path: 'horizontal',
maxScale: 1.3,
overlay: {
opacity: .8
},
styles: {
nextOffsetX: 75,
nextOpacity: .55,
prevOffsetX: 75,
prevOpacity: .55
},
thumbnails: {
normalOpacity: .9,
activeOpacity: 1
},
controls: {
thumbnail: 1,
arrows: 1
}
});
$('#demo5').scrollbox({
direction: 'h',
distance: 150,
autoPlay: false
});
$('#prew').click(function () {
$('#demo5').trigger('backward');
});
$('#next').click(function () {
$('#demo5').trigger('forward');
});
});
</script>