Cuando se utiliza una etiqueta <select>
en una página HTML, ¿hay una manera de estilizar el tamaño del texto en la rueda de desplazamiento que muestra en el iPhone?Styling <select> etiqueta para iPhone
Respuesta
No creo que pueda diseñar la rueda que aparece en el iPhone directamente. De hecho, incluso la modificación en navegadores tiene un soporte extraño. Por ejemplo, http://jsbin.com/obake3 no funciona en absoluto en Chrome, solo modifica el menú desplegable real en Safari y estira el gráfico de una manera muy desagradable en Firefox.
Tomado de Sitepoint Ref
El seleccione renders de forma ligeramente diferente dependiendo del navegador y sistema operativo en uso, y es bien conocido como un elemento HTML problemático estilo con CSS (ya que la pantalla se hereda de la operación sistema, en lugar de proporcionado por el navegador)
Existe esta alternativa.
http://cubiq.org/spinning-wheel-on-webkit-for-iphone-ipod-touch
Se utiliza javascript para poner los elementos de la página .. Me lo usaron para una aplicación web/iPhone y funcionó muy bien. Habría un estilo personalizado si quisiera cambiar los tamaños de texto predeterminados y también podría cargar imágenes personalizadas.
Increíble. Algunos desarrolladores están realmente dispuestos a hacer un esfuerzo adicional para mejorar la experiencia del usuario de las aplicaciones web de iOS. –
lo que me parece increíble es que hay gente por ahí pateando culos y tomando nombres poniendo estos scripts a la venta de forma gratuita. – Kieran
Investigamos y no pudimos encontrar ninguna manera confiable de alterar la pantalla, así que buscamos en diferentes bibliotecas. Estamos teniendo buena suerte con el Mobiscroll library for jQuery. Es un proyecto más actualizado que el proyecto cubiq mencionado en otras respuestas.
El control es themable. Puede cambiar fácilmente la apariencia de si está en CSS. También viene con esquemas de color predefinidos y bonitos.
Lo elegimos porque funciona en todos los dispositivos, lo que permite una apariencia más consistente & feel.
- 1. androide 4.0 del subtítulo (sección) Etiqueta Styling
- 2. Styling el elemento <hr />
- 3. Styling para <entrada requerida ...> en WebKit
- 4. Styling discapacitados <select> (cuadros desplegables) en HTML
- 5. css print styling
- 6. CSS Styling con Swing
- 7. ActionSherlockBar Styling - PopupMenu
- 8. CSS Styling Checkboxes
- 9. WPF tabcontrol styling
- 10. ActionBar Divider Styling
- 11. Styling GridSplitter wpf C#
- 12. carriles form_for styling
- 13. Colores Styling WPF
- 14. Webkit scrollbar dynamic styling
- 15. TextBox Caret Styling
- 16. jQuery UI Tabs Minimal Styling
- 17. Google chart API styling tooltips
- 18. Styling elementos anidados en WPF
- 19. CSS personalizado para la etiqueta <audio>?
- 20. xpath para seleccionar <option> etiqueta html?
- 21. JQuery, establecer atributo para <a> etiqueta
- 22. ancho para <a> etiqueta en html
- 23. Expandir una etiqueta <a> para llenar el espacio
- 24. Detección confiable <img> soporte de etiqueta para SVG
- 25. ayudantes HTML Styling ASP.NET MVC
- 26. Styling EditText vista con forma dibujable para que parezca un nuevo tema holográfico para Android <3.0
- 27. <img> vs <image> etiqueta en HTML
- 28. ¿Es incorrecto colocar la etiqueta <script> después de la etiqueta</body>?
- 29. ¿Es válido tener una etiqueta <section> dentro de otra etiqueta <section>?
- 30. <script> etiqueta debe incluir etiqueta separada</script>?
Kieran y Pat Fowler, sus respuestas se ven bien. No sabía cuál es la respuesta, si es que hay alguna, para otorgar la recompensa. Realmente me gustaría tener algo que funcione en los navegadores de escritorio, que ni lo cubiq ni Mobiscroll hacen. Por ahora, estoy usando este plugin jQuery (http://www.bulgaria-web-developers.com/projects/javascript/selectbox/) pero estoy manteniendo mis ojos abiertos en caso de que surja algo mejor. –