code: function () {
              var results = this.results, children, index, child, hb, rb, y, more;
  
              index = this.highlight();
  
              if (index < 0) return;
  
              if (index == 0) {
  
                  // if the first element is highlighted scroll all the way to the top,
                  // that way any unselectable headers above it will also be scrolled
                  // into view
  
                  results.scrollTop(0);
                  return;
              }
  
              children = results.find(".select2-result-selectable");
  
              child = $(children[index]);
  
              hb = child.offset().top + child.outerHeight();
  
              // if this is the last child lets also make sure select2-more-results is visible
              if (index === children.length - 1) {
                  more = results.find("li.select2-more-results");
                  if (more.length > 0) {
                      hb = more.offset().top + more.outerHeight();
                  }
              }
  
              rb = results.offset().top + results.outerHeight();
              if (hb > rb) {
                  results.scrollTop(results.scrollTop() + (hb - rb));
              }
              y = child.offset().top - results.offset().top;
  
              // make sure the top of the element is visible
              if (y < 0) {
                  results.scrollTop(results.scrollTop() + y); // y is negative
              }
          }
docs: abstract