diff --git a/_img/close.png b/_img/close.png
new file mode 100644
index 0000000..6b71afd
Binary files /dev/null and b/_img/close.png differ
diff --git a/_img/next.png b/_img/next.png
new file mode 100644
index 0000000..ea91bdf
Binary files /dev/null and b/_img/next.png differ
diff --git a/_img/prev.png b/_img/prev.png
new file mode 100644
index 0000000..ec2c054
Binary files /dev/null and b/_img/prev.png differ
diff --git a/gallery.js b/gallery.js
new file mode 100644
index 0000000..c000c51
--- /dev/null
+++ b/gallery.js
@@ -0,0 +1,57 @@
+
+// Create function to load image
+function loadImg(src){
+    var body = document.getElementsByTagName("body")[0];
+    var div = document.getElementById("gallery_container");
+
+    if( !div ) {
+        div = document.createElement('div');
+        div.setAttribute('id', 'gallery_container');    
+        body.appendChild(div);  
+
+        var anch = document.createElement('a');
+        anch.setAttribute('href', '#'); 
+        div.appendChild(anch);
+        
+        var close = new Image();
+        close.src = "_img/close.png"
+        close.id = "gallery_close";
+        close.onclick = function(){
+            div.style.visibility='hidden';
+            return false;
+        }
+        anch.appendChild(close);
+        
+        anch = document.createElement('a');
+        anch.setAttribute('href', '#'); 
+        var prev = new Image();
+        anch.appendChild(prev);
+        div.appendChild(anch);
+        prev.src = "_img/prev.png";
+        prev.id = "gallery_prev";
+        
+        var img = new Image()
+        div.appendChild(img);
+        img.src = src;
+        
+        anch = document.createElement('a');
+        anch.setAttribute('href', '#'); 
+        var next = new Image();
+        anch.appendChild(next);
+        div.appendChild(anch);
+        next.src = "_img/next.png";
+        next.id = "gallery_next";
+    }else{
+        var oldimg = div.getElementsByTagName("img"); 
+        if( oldimg ){
+            for( var i=0; i<oldimg.length; i++){
+                if( oldimg[i].parentNode == div ){
+                    oldimg[i].src = src;
+                }
+            }
+        }
+        div.style.visibility='visible';
+    }
+
+}
+
diff --git a/mdx_gallery.py b/mdx_gallery.py
index 069b1de..63d92eb 100644
--- a/mdx_gallery.py
+++ b/mdx_gallery.py
@@ -20,6 +20,7 @@ class GalleryPattern(Pattern):
             anch = markdown.util.etree.Element('a')
             anch.attrib["href"]=img
             anch.attrib["target"]="_blank"
+            anch.attrib["onclick"]='loadImg("%s");return false;' % (img)
             li.append(anch)
             
             img_el = markdown.util.etree.Element('img')
diff --git a/pylog_config.py b/pylog_config.py
index 54568cf..b4bce49 100644
--- a/pylog_config.py
+++ b/pylog_config.py
@@ -9,6 +9,7 @@ subtitle=u'produced py Powertomato \xb0\u0DF4\xb0'
 header="""
 <link rel="stylesheet" type="text/css" href="style.css" />
 <link rel="stylesheet" type="text/css" href="source.css" />
+<script src="gallery.js"></script> 
 """                 
 # This header will be printed in the <head> section of the html file
 
diff --git a/style.css b/style.css
index 9dab778..347aa54 100644
--- a/style.css
+++ b/style.css
@@ -1,3 +1,33 @@
+#gallery_container {
+    position:absolute;
+    top:0px; left:0px;
+    background-color:#222222;
+    width:100%;
+    height:100%;
+    display:table-cell;
+    vertical-align:middle;
+    text-align:center;
+    overflow:scroll;
+}
+
+#gallery_container img{
+    margin-top:30px;
+    margin-bottom:30px;
+}
+
+#gallery_close {
+    position:absolute;
+    right:30px;
+}
+
+#gallery_prev {
+    padding-bottom:15px;
+}
+
+#gallery_next {
+    padding-bottom:15px;
+}
+
 /* generall */
 .hidden {
     display: none
