¿Te gusta el aspecto de los botones de opción del iPhone OS?. ¿Utilizas jQuery para tus proyectos?. Thomas Reynolds se ha tomado la molestia de crear un script que remplazará nuestros “checkbox” por unos mucho mas vistosos.
Si algo caracteriza a este script es su sencillez y capacidad de adaptación total con nuestras plantillas HTML.
Podéis ver la demostración del script, descargarlo o seguir leyendo el artículo para conocerlo un poco más a fondo.
Este script es realmente sencillo de utilizar. Tan solo tendremos que subir a nuestro servidor los archivos, contenidos en el .zip, y cambiar las rutas que sean necesarias en la hoja de estilos.
Una vez que hemos realizado estos cambios, utilizaremos el script de la siguiente manera:
<head>
<script src="jquery-1.3.2.js" type="text/javascript" charset="utf-8"></script>
<script src="iphone-style-checkboxes.js" type="text/javascript" charset="utf-8"></script>
<link rel="stylesheet" href="style.css" type="text/css" media="screen" charset="utf-8" />
<script type="text/javascript" charset="utf-8">
$(document).ready(function() {
$(':checkbox').iphoneStyle();
});
</script>
</head>
</html>El script, como ya he dicho, viene muy completo. Nos permite modificar el texto que se muestra en los checkbox:
- checkedLabel texto que se muestra en estado de “on”. Por defecto: ON
- uncheckedLabel texto que se muestra en estado de “off”. Por defecto: OFF
Por ejemplo:
$(':checkbox').iphoneStyle({ checkedLabel: 'YES', uncheckedLabel: 'NO' });