title: jQuery UI autocomplete leaves randomly sized gray box
body: <p>I'm currently getting more and more confused by jQuery's autocomplete feature.
  With the suggestion box's first popup, a gray background box is created and remains after selecting a value.
  It only disappears in re-rendered areas.
  e.g. toggling a checkbox's state makes the gray box disappear withing the checkbox's bounding box.</p>
  
  <p>I really cannot determine why or how this box appears, nor can I locate it's color's definition.</p>
  
  <p>Here's my code for initializing the autocomplete feature:</p>
  
  <pre><code>$('#inputsubstance')
  .autocomplete({
      minLength: 2,
      source: schadstoffliste,
      focus: function() {
          return false;
      },
      select: function(event, ui) {
          this.value = ui.item.label + " (" + ui.item.cas + ")";
          return false;
      }
  }).data("ui-autocomplete")._renderItem = function(ul,item){
      return $("&lt;li&gt;&lt;/li&gt;")
      .data("item.autocomplete", item)
      .append("&lt;a&gt;&lt;strong&gt;"+item.label+"&lt;/strong&gt; / "+item.cas+" - "+item.value+"&lt;/a&gt;")
      .appendTo(ul);
  };
  </code></pre>
  
  <p>I'm using the smootheness theme and I'm developing for phonegap on iPad.
  Unfortunately I can't test on a desktop browser right now, since I'm using phonegap's File API. But this happened on desktop as well, at least in Chrome.</p>
  
  <p>EDIT:</p>
  
  <p>On desktop browsers the overlay does NOT appear - somehow tricked myself.
  The overlay seems to be the iPad's automatically generated overlay, shown when the keyboard appears.</p>