diff --git a/resources/viewer/images.js b/resources/viewer/images.js
index ea68009254..c03ea1d85b 100644
--- a/resources/viewer/images.js
+++ b/resources/viewer/images.js
@@ -7,13 +7,42 @@
 function scale_images() {
     $("img:visible").each(function() {
         var offset = $(this).offset();
+        var avail_width = window.innerWidth - offset.left - 5;
+        var avail_height = window.innerHeight - 5;
+        var img = $(this);
+        img.css('width', img.data('orig-width'));
+        img.css('height', img.data('orig-height'));
+        var width = img.width();
+        var height = img.height();
+        var ratio = 0;
+
+        if (width > avail_width) {
+            ratio = avail_width / width;
+            img.css('width', avail_width+'px');
+            img.css('height', (ratio*height) + 'px');
+            height = height * ratio;
+            width = width * ratio;
+        }
+
+        if (height > avail_height) {
+            ratio = avail_height / height;
+            img.css('height', avail_height);
+            img.css('width', width * ratio);
+        }
         //window.py_bridge.debug(window.getComputedStyle(this, '').getPropertyValue('max-width'));
-        $(this).css("max-width", (window.innerWidth-offset.left-5)+"px");
-        $(this).css("max-height", (window.innerHeight-5)+"px");
+    });
+}
+
+function store_original_size_attributes() {
+    $("img").each(function() {
+        var img = $(this);
+        img.data('orig-width', img.css('width'));
+        img.data('orig-height', img.css('height'));
     });
 }
 
 function setup_image_scaling_handlers() {
+   store_original_size_attributes();
    scale_images();
    $(window).resize(function(){
         scale_images();