hovercard: better placement management

diff --git a/js/hovercard.js b/js/hovercard.js
index 9b326dcd3e0775ac312e187bcce50a2a1c1e72dc..1fce282c08249449eb0bc9a79cec0c093967cdd4 100644 (file)
--- a/js/hovercard.js
+++ b/js/hovercard.js
@@ -62,7 +62,16 @@ $(document).ready(function(){
                                                        if(data) {
                                                                targetElement.popover({
                                                                        html: true,
-                                                                       placement: 'auto',
+                                                                       placement: function () {
+                                                                               // Calculate the placement of the the hovercard (if top or bottom)
+                                                                               // The placement depence on the distance between window top and the element
+                                                                               // which triggers the hover-card
+                                                                               var get_position = $(targetElement).offset().top - $(window).scrollTop();
+                                                                               if (get_position < 270 ){
+                                                                                       return "bottom";
+                                                                               }
+                                                                               return "top";
+                                                                       },
                                                                        trigger: 'manual',
                                                                        template: '<div class="popover hovercard" data-card-created="' + timeNow + '"><div class="arrow"></div><div class="popover-content hovercard-content"></div></div>',
                                                                        content: data