commit 69fb3dbb808ed317ce1ad00b8c806df28b59e8d7
Author: Andreas Kohlbecker <a.kohlbecker@bgbm.org>
Date:   Fri Dec 2 10:42:03 2016 +0100

    ref #5956 improving classification breadcrumb nav
      - avoiding boxes that are not being closed on mouse out
      - more consistent UI by adding ... as trigger for the last element
      - boxes are hidden by slideup effect

diff --git a/modules/cdm_dataportal/includes/pages.inc b/modules/cdm_dataportal/includes/pages.inc
index 42c39b7e..7a9e2e88 100644
--- a/modules/cdm_dataportal/includes/pages.inc
+++ b/modules/cdm_dataportal/includes/pages.inc
@@ -995,6 +995,7 @@ function compose_classification_breadcrumbs($taxon_uuid) {
     . font_awesome_icon_markup('fa-chevron-right')
     . ' </span>';
   $more_children_icon = font_awesome_icon_markup('fa-sitemap fa-rotate-270');
+  $more_children_label = '...';
 
   $items[] = $node_name;
 
@@ -1036,16 +1037,18 @@ function compose_classification_breadcrumbs($taxon_uuid) {
   // add more button to the end
   if(!$parent_taxon_nodes) {
     // not taxon focused yet, adding button to make  the root nodes available
-    $items[] = '<span class="taxonomic-children-button" data-classification-uuid="' . $current_classification_uuid
-      . '" data-rank-limit-uuid="' . $rank_limit_uuid . '" > '
-      . $more_children_icon
-      . '&nbsp;</span>';
+    $items[] = '<span>'
+      . $more_children_icon . '&nbsp;' .
+      '<span class="taxonomic-children-button" data-classification-uuid="' . $current_classification_uuid
+      . '" data-rank-limit-uuid="' . $rank_limit_uuid . '" > ' . $more_children_label . '<span>'
+      . '</span>';
   } else if($more_children_for){
     // last parent item has child taxon nodes
-    $items[] = ' <span class="taxonomic-children-button" data-cdm-taxon-uuid="' .$more_children_for
-      . '" data-cdm-classification-mode="children" >'
-      . $more_children_icon
-      . '&nbsp;</span>';
+    $items[] = ' <span>'
+      . $more_children_icon . '&nbsp;' .
+      '<span class="taxonomic-children-button" data-cdm-taxon-uuid="' .$more_children_for
+      . '" data-cdm-classification-mode="children" >' . $more_children_label . '</span>'
+      . '</span>';
 
   }
 
@@ -1054,6 +1057,7 @@ function compose_classification_breadcrumbs($taxon_uuid) {
   return $render_array;
 }
 
+
 /**
  * @param $specimen_uuid
  * @return array
diff --git a/modules/cdm_dataportal/js/jquery.cdm.taxonomic_children.js b/modules/cdm_dataportal/js/jquery.cdm.taxonomic_children.js
index d690b07a..3d116245 100644
--- a/modules/cdm_dataportal/js/jquery.cdm.taxonomic_children.js
+++ b/modules/cdm_dataportal/js/jquery.cdm.taxonomic_children.js
@@ -250,7 +250,11 @@
       //         when using rotate, in IE and edge the child element are also rotated, need to reset child elements.
       // this.$element.addClass(this.options.activeClass);
 
-      this.$element.append(this.container);
+      this.container.hide();
+      if(!this.container.parent() || this.container.parent().length == 0){
+        // first time this container is used
+        this.$element.append(this.container);
+      }
 
       this.baseHeight = this.$element.parent().height();
       this.lineHeight = this.$element.parent().css('line-height').replace('px', ''); // TODO use regex fur replace
@@ -273,6 +277,7 @@
           plugin.handleDataLoaded(html);
         });
       } else {
+        this.container.slideDown();
         this.adjustHeight();
         this.scrollToSelected();
       }
@@ -280,8 +285,8 @@
 
     hideChildren: function(){
       //return; // uncomment for debugging
-      this.container
-        .detach();
+      this.container.slideUp();
+      //this.container.detach();
     },
 
     handleDataLoaded: function(html){
@@ -294,9 +299,11 @@
         // necessary in case of compose_classification_selector
         listContainer = listContainer.children('ul');
       }
+      this.container.hide();
       this.children.append(listContainer);
       this.itemsCount = listContainer.children().length;
 
+      this.container.show();
       this.adjustHeight();
       this.scrollToSelected();
     },
@@ -330,8 +337,10 @@
 
     scrollToSelected: function () {
 
+      // first reset the scroll position to 0 so that all calculation are using the same reference position
+      this.container.scrollTop(0);
       var scrollTarget = this.children.find(".focused");
-      if(scrollTarget){
+      if(scrollTarget && scrollTarget.length > 0){
         var position = scrollTarget.position();
         if(position == undefined){
           // fix for IE >= 9 and Edge
@@ -393,8 +402,6 @@
         }
       }
 
-
-
       this.log("contentRequest: " + contentRequest);
 
       var proxyRequest = this.options.proxyRequest
