diff --git a/src/Report/Html/Renderer/Template/css/style.css b/src/Report/Html/Renderer/Template/css/style.css
index 5cc65bf73..8fdf0c858 100644
--- a/src/Report/Html/Renderer/Template/css/style.css
+++ b/src/Report/Html/Renderer/Template/css/style.css
@@ -29,6 +29,11 @@ nav .breadcrumb {
  max-width: none;
 }
 
+.popover-body {
+ max-height: 90vh;
+ overflow-y: auto;
+}
+
 .octicon {
  margin-right:.25em;
  vertical-align: baseline;
diff --git a/src/Report/Html/Renderer/Template/js/file.js b/src/Report/Html/Renderer/Template/js/file.js
index 29cacd4d1..124a8a18f 100644
--- a/src/Report/Html/Renderer/Template/js/file.js
+++ b/src/Report/Html/Renderer/Template/js/file.js
@@ -1,62 +1,53 @@
-  $(function() {
-   var $window     = $(window)
-     , $top_link   = $('#toplink')
-     , $body       = $('body, html')
-     , offset      = $('#code').offset().top
-     , hidePopover = function ($target) {
-        $target.data('popover-hover', false);
-
-        setTimeout(function () {
-         if (!$target.data('popover-hover')) {
-          $target.popover('hide');
-         }
-        }, 300);
-     };
-
-   $top_link.hide().click(function(event) {
+$(function () {
+  var $window = $(window)
+    , $top_link = $('#toplink')
+    , $body = $('body, html')
+    , offset = $('#code').offset().top;
+
+  $top_link.hide().click(function (event) {
     event.preventDefault();
-    $body.animate({scrollTop:0}, 800);
-   });
+    $body.animate({scrollTop: 0}, 800);
+  });
 
-   $window.scroll(function() {
-    if($window.scrollTop() > offset) {
-     $top_link.fadeIn();
+  $window.scroll(function () {
+    if ($window.scrollTop() > offset) {
+      $top_link.fadeIn();
     } else {
-     $top_link.fadeOut();
+      $top_link.fadeOut();
     }
-   }).scroll();
-
-   $('.popin')
-    .popover({trigger: 'manual'})
-    .on({
-     'mouseenter.popover': function () {
-      var $target = $(this);
-      var $container = $target.children().first();
-
-      $target.data('popover-hover', true);
-
-      // popover already displayed
-      if ($target.next('.popover').length) {
-       return;
-      }
-
-      // show the popover
-      $container.popover('show');
-
-      // register mouse events on the popover
-      $target.next('.popover:not(.popover-initialized)')
-       .on({
-        'mouseenter': function () {
-         $target.data('popover-hover', true);
-        },
-        'mouseleave': function () {
-         hidePopover($container);
+  });
+
+  var $popovers = $('.popin > :first-child');
+  $('.popin').on({
+    'click.popover': function (event) {
+      event.stopPropagation();
+
+      var $container = $(this).children().first();
+
+      //Close all other popovers:
+      $popovers.each(function () {
+        var $current = $(this);
+        if (!$current.is($container)) {
+          $current.popover('hide');
         }
-       })
-       .addClass('popover-initialized');
-     },
-     'mouseleave.popover': function () {
-      hidePopover($(this).children().first());
-     }
-    });
+      });
+
+      // Toggle this popover:
+      $container.popover('toggle');
+    },
+  });
+
+  //Hide all popovers on outside click:
+  $(document).click(function (event) {
+    if ($(event.target).closest($('.popover')).length === 0) {
+      $popovers.popover('hide');
+    }
+  });
+
+  //Hide all popovers on escape:
+  $(document).keyup(function (event) {
+    if (event.key === 'Escape') {
+      $popovers.popover('hide');
+    }
   });
+});