DISPLAY IMAGE ON STATIC POSITION

    LEYKADA
    LEYKADA
    LEYKADA
 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
<style>
.photo1 {position: relative; width:234px;height:16px; background:#105105;color:#FFFFFF; font: 13px arial;margin:0;padding:0px; border: 1px solid #FFFF00;display: inline-block;}
.photo1:before {content: "ΛΕΥΚΑΔΑ ΠΟΡΤΟ ΚΑΤΣΙΚΙ"; font: 13px arial; background:#105105;color:#FFFFFF; }
.photo1:focus {pointer-events: none;}
.photo1:focus .photo1-content {visibility:visible;pointer-events: auto;}
.photo1-content {position: fixed; left:0px;top:81px;width:640px;height:auto;z-index:9999; visibility:hidden;margin:0;padding:0px;display: inline-block;}
</style>
<div tabindex="0" class="photo1"><ul class="photo1-content">
<img src="https://i.imgur.com/rcivwQJm.jpg" title="LEYKADA PORTO KATSIKI" alt="LEYKADA" width:640px; height:400px; /></ul></div>

<style>
.photo2 {position: relative; width:234px;height:16px; background:#173377;color:#FFFFFF; font: 13px arial;margin:0;padding:0px; border: 1px solid #FFFF00;display: inline-block;}
.photo2:before {content: "ΛΕΥΚΑΔΑ ΑΓΙΟΦΥΛΙ"; font: 13px arial; background:#173377;color:#FFFFFF; }
.photo2:focus {pointer-events: none;}
.photo2:focus .photo2-content {visibility:visible;pointer-events: auto;}
.photo2-content {position: fixed; left:400px;top:81x;width:640px;height:auto;z-index:9999; visibility:hidden;margin:0;padding:0px;display: inline-block;}
</style>
<div tabindex="0" class="photo2"><ul class="photo2-content">
<img src="https://i.imgur.com/wIBlr1Zm.jpg"  title="LEYKADA AGIOFYLI" alt="LEYKADA" width:640px; height:400px; /></ul></div>

<style>
.photo3 {position: relative; width:234px;height:16px; background:#760960;color:#FFFFFF; font: 13px arial;margin:0;padding:0px; border: 1px solid #FFFF00;display: inline-block;}
.photo3:before {content: "ΛΕΥΚΑΔΑ ΕΓΓΡΕΜΝΟΙ"; font: 13px arial; background:#760960;color:#FFFFFF; }
.photo3:focus {pointer-events: none;}
.photo3:focus .photo3-content {visibility:visible;pointer-events: auto;}
.photo3-content {position: fixed; left:800px;top:81px;width:640px;height:auto;z-index:9999; visibility:hidden;margin:0;padding:0px;display: inline-block;}
</style>
<div tabindex="0" class="photo3"><ul class="photo3-content">
<img src="https://i.imgur.com/H2PNDWBm.jpg" title="LEYKADA EGGREMNOI" alt="LEYKADA" width:640px; height:400px; /></ul></div>