Se define en:
.ui-widget {
font-family: Verdana,Arial,sans-serif;
font-size: 10px;
}
Pero puedes precederle algo, por ejemplo,
.ui-autocomplete.ui-widget {
font-family: Verdana,Arial,sans-serif;
font-size: 10px;
}
Pregunta
La fuente de la lista de sugerencias de autocompletar jQuery es muy mayor, quiero ser pequeño como escribir en el cuadro de texto que necesita. ¿Cómo restringir con pequeñas fuentes en la lista de sugerencias? Consulte la pantalla y código a continuación:
<!DOCTYPE>
<html>
<head>
<title>Auto Complete in JSP Java</title>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>
<STYLE TYPE="text/css" media="all">
.ui-autocomplete {
position: absolute;
cursor: default;
height: 200px;
overflow-y: scroll;
overflow-x: hidden;}
</STYLE>
<script>
$(function() {
$("#names").autocomplete({
source: function(request, response) {
$.ajax({
url: "searchName.jsp",
type: "POST",
dataType: "json",
data: { name: request.term},
success: function( data, textStatus, jqXHR) {
var items = data;
response(items);
},
error: function (error) {
alert('error: ' + error);
}
});
},
minLength: 3
});
});
</script>
</head>
<body>
<input type="text" name="name" id="names" />
</body>
</html>
Solución
Se define en:
.ui-widget {
font-family: Verdana,Arial,sans-serif;
font-size: 10px;
}
Pero puedes precederle algo, por ejemplo,
.ui-autocomplete.ui-widget {
font-family: Verdana,Arial,sans-serif;
font-size: 10px;
}
Otros consejos
por ejemplo :
$('.ui-autocomplete-input').css('fontSize', '10px');
La información sobre el estilo del widget de autocompletar se puede encontrar aquí:
los ul
marcado después del ui-autocomplete-input
son los resultados que genera. Por apuntar ul.ui-autocomplete.ui-menu
Deberías obtener lo que necesitas.