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 | <script src='https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js'></script>
<script src="https://github-codes.github.io/mycodes/javascripts/jquery-cycle2A.js"></script>
<script src="https://github-codes.github.io/mycodes/javascripts/jquery-cycle2B.js"></script>
<script>$.fn.cycle.defaults.autoSelector = '.slideshow';</script>
<style>
.slideshow {margin: auto}
.slideshow img {width:auto; height:200px; padding:2px; }
div.responsive img {width:auto; height:200}
.center {position:static; text-align:center;margin-top:2px}
div.vertical {width:auto;}
</style>
<div class="slideshow vertical"
data-cycle-fx=carousel
data-cycle-timeout=2000
data-cycle-carousel-visible=3
data-cycle-carousel-vertical=true
data-cycle-next="#next"
data-cycle-prev="#prev">
<img alt="KERKYRA" src="https://i.imgur.com/Pq9Dexam.jpg" />
<img alt="PAXOI" src="https://i.imgur.com/kbCkBYem.jpg" />
<img alt="LEYKADA" src="https://i.imgur.com/gCr4ycDm.jpg" />
<img alt="ITHAKI" src="https://i.imgur.com/JcRaeRSm.jpg" />
<img alt="KEFALLONIA" src="https://i.imgur.com/XMS6PHsm.jpg" />
<img alt="ZAKYNTHOS" src="https://i.imgur.com/I9SFA0sm.jpg" />
</div>
<div class=left>
<a href=# id=prev>◄◄ PREV</a>
<a href=# id=next>NEXT ►►</a>
</div>
|
