Autocomplete vertical scroll-to-top bug

[jjtroberts]

Under 1.9.2 CSS, when the number of results from autocomplete exceeds max-height AND the user scrolls down the result list, whenever the mouse hovers over a result item the result list jumps back to the top making it impossible to scroll down and select an item from the list.

I removed jquery-ui-1.9.2.custom.min.css and replaced it with jquery-ui-1.8.23.custom.css and the problem went away.

Pertinent code is below:

$('#search').autocomplete({
			source: "<?php echo Router::url(array('controller' => 'Residents','action' => 'Search')); ?>",
			minLength: 2,
			select: function( event, ui ) {
				var ResidentControllers = new Array(
					"Residents","Accounts","EmergencyContacts","Notifications","TransportationPasses"
				);
				var controller = "<?php echo $this->name; ?>";
				var action     = "<?php echo $this->action; ?>";
				if(ResidentControllers.indexOf(controller) != -1){
					location.href="<?php echo Router::url(array('controller' => '"+controller+"','action' => '"+action+"')); ?>/"+ui.item.value;
				}else{
					location.href="<?php echo Router::url(array('controller' => 'Residents','action' => 'Edit')); ?>/"+ui.item.value;
				}
				return false;
			},
			open: function(){
		        $(this).autocomplete('widget').css('z-index', 9999999999999999);
		        return false;
		    }
		}).data("autocomplete")._renderItem = function(ul, item){
			if(item.value){
	    		var imageUrl = "<?php echo $this->Html->webroot('img/residents/'); ?>";
	    		return $( "<li></li>" )
					.data( "item.autocomplete", item )
					.append(
						"<a class=\"uiasearchitem\" style=\"float:left;\">"+
							"<div style=\"float:left;\">"+
								"<img class=\"avatar\" width=\"80px\" height=\"60px\" src=\""+imageUrl+item.filename+"\" />"+
							"</div>"+
							"<div class=\"username\" style=\"font-size:10px;float:left;clear:right;width:240px;\">"+item.name+"</div>"+
							"<div class=\"laststay\" style=\"font-size:10px;float:left;clear:right;width:240px;\">"+item.last_stay+"</div>"+
							"<div class=\"bars\"     style=\"font-size:10px;float:left;clear:right;width:240px;\">No Bars</div>"+
						"</a>"
					).appendTo( ul );
			}else{
				return $( "<li></li>" )
					.data( "item.autocomplete", item )
					.append(item.message)
					.appendTo( ul );
			}
    	};