Select con ancho fijo para Internet Explorer
en jquery css publicado el 02 de agosto de 2010
selectfixedwidth es un plugin jQuery que intenta resolver el problema de las listas desplegables <select> de ancho fijo con opciones que superan ese ancho para Internet Explorer.
Mientras que en todos los navegadores más populares (Firefox, Chrome, Opera, Safari) al seleccionar la lista, el ancho de las opciones se adapta automáticamente, Internet Explorer, incluso en su versión más reciente, no lo hace, con lo cual parte del texto queda cortado y crea un grave problema de usabilidad.
¿Cómo funciona?
Lo primero que hay que hacer es incluir las librerías para jQuery y para el plugin en la cabecera <head> del documento html.
<script src="js/jquery-1.3.2.min.js" type="text/javascript"></script>
<script type="text/javascript" src="js/jquery.selectfixedwidth.js"></script>
Y después indicar para qué listas desplegables se quiere utilizar el plugin.
<script type="text/javascript">
$(document).ready(
function() {
$("select.fixedwidth").selectfixedwidth();
}
);
</script>
Opciones
El plugin únicamente tiene una opción de configuración. Se trata de un timeout interno que por defecto tiene el valor de 300ms. Si el plugin no se comporta como debería, se puede cambiar ese valor de la forma siguiente:
$("select.fixedwidth").selectfixedwidth({timeout: 1000});
Navegadores soportados
El plugin únicamente funciona para Internet Explorer. Para cualquier otro navegador no tendrá efecto. Las versiones soportadas son a partir de la 7.