martes, 16 de diciembre de 2014

Invocar al plugin checkbox personalizado con jQuery

Ya que hemos hecho un checkbox personalizado, por un objeto de options, vamos a mostrar cómo se pueden crear varios
tipos de checkbox con este código. Veamos el siguiente HTML:
<span class="ch">Seleccionar</span>
<span class="ch">Me interesa</span>
<span class="ch">Oooo</span>
<br>
<br>
<span id="otro">otro suelto</span>
Se puede apreciar que tenemos simples elementos SPAN. Por un lado tenemos 3 SPAN con la clase "ch" y por otro lado otro SPAN suelto con identificador "otro". Ahora veamos cómo los convertiríamos en campos de formulario checkbox
personalizados:
$(".ch").checkboxPersonalizado();
Así crearíamos 3 checkbox, en los 3 primeros SPAN que tenían la class "ch". Estos checkbox personalizados se crearían con las opciones por defecto.
$("#otro").checkboxPersonalizado({
activo: false,
colorTextos: {
activo: "#f80",
pasivo: "#98a"
},
imagen: {
activo: 'images/weather_cloudy.png',
pasivo: 'images/weather_rain.png'
},
textos: {
activo: 'Buen tiempo :)',
pasivo: 'Buena cara ;)'
},
cssAdicional: {
border: "1px solid #dd5",
width: "100px"
},
nameCheck: "buen_tiempo"
});
En este segundo caso de invocación al plugin estamos convirtiendo en un checkbox personalizado el último SPAN, que tenía identificador "otro". En este segundo caso estamos utilizando multitud de variables de configuración específicas, que harán que el checkbox tenga un aspecto radicalmente diferente a los anteriores

No hay comentarios:

Publicar un comentario