html - ejemplos - Estilo de lista desplegable en Internet Explorer
select html bootstrap (6)
Las listas desplegables son esencialmente controladas por el navegador. El estilo limitado funciona a veces, pero es completamente incompatible con el navegador cruzado. La razón de esto es que a menudo están usando la representación del sistema operativo para el menú desplegable.
Si desea un control total sobre su menú desplegable, debe dibujarlo usted mismo desde cero usando <ul> y <li> , haga que el menú desplegable active una etiqueta <a> y use javascript para alternar la visibilidad de <ul> y transferir los valores elegidos.
Existen complementos de JavaScript que toman un menú desplegable existente y le hacen algo comparable. No conozco uno que coincida exactamente con su solicitud, pero algo así como un autocompletado de JQueryUI en el modo de cuadro combinado ( http://jqueryui.com/autocomplete ) puede darle un buen punto de partida para el estilo.
Esta pregunta ya tiene una respuesta aquí:
- IE10 Select box issue 4 answers
Tengo algunos problemas con la forma en que IE renderiza mi DropDownList. En Firefox se ve como debería y esa es la forma en que quería mostrar en IE también. Aquí hay una captura de pantalla de la lista desplegable en Firefox:
captura de pantalla en IE:
Quiero que el menú desplegable se expanda verticalmente hasta donde está la lista desplegable, no quiero que el menú desplegable vaya debajo del control desplegable existente. ¿Hay algún truco de cómo hacer eso con CSS? Gracias de antemano, Laziale
La razón de esto es que cada navegador tiene una implementación diferente para los cuadros de selección. Es casi imposible implementar un buen cuadro de selección compatible con crossbrowser. La única forma de realizar una implementación ''segura'' es ocultar el cuadro de selección y reemplazarlo con una implementación de lista de selección personalizada.
Recomiendo encarecidamente usar un componente ya existente. Si ya usa jQuery, eche un vistazo a Select2 .
Select2 es un reemplazo basado en jQuery para cuadros de selección. Es compatible con la búsqueda, los conjuntos de datos remotos y el desplazamiento infinito de los resultados.
Lo uso desde hace un par de meses en mi página y puedo decir que es absolutamente genial.
Este jsfiddle no es definitivo, pero no tendrá opción de tener su propia lista de selección personalizada si tiene el mismo aspecto en cada descarga.
El ejemplo en mi jsfiddle es la manera más fácil para mí de implementar una lista de selección. Al utilizar el botón de <input type="radio" /> , es fácil personalizarlo a través de css y obtener el valor seleccionado.
Solo échale un vistazo.
Consulte: IE10 Seleccione el problema del cuadro
Este es el comportamiento predeterminado para este control en Internet Explorer 10. Según la cantidad de elementos en la lista y el tamaño de la pantalla, otros navegadores también mostrarán el menú de manera diferente, aunque creo que IE10 es el único navegador que equilibrará la cantidad de elementos por encima y por debajo del elemento de selección cuando se abre el menú desplegable.
Esta es la manera en que los menús desplegables funcionan en Internet Explorer 10 y versiones posteriores (así como en las aplicaciones de la Tienda Windows): cuando se abre el menú, el elemento seleccionado se superpone al control desplegable, que otros elementos aparecen arriba y debajo . Presumiblemente, Microsoft hizo este cambio para que el menú sea más fácil de usar .
Busqué en la lista de propiedades CSS compatibles con Internet Explorer , pero no noté ninguna que afectara la posición del menú. Entonces, si este comportamiento es inaceptable, deberá evitar el control del sistema operativo nativo a favor de un menú desplegable basado en HTML / CSS, como jQuery Selectmenu o Telerik''s RadDropDownList .