Programación Web en cliente

Temas gráficos en jQuery

jQuery ofrece algunas herramientas (por ejemplo cuadros de dialogo) que requieren CSS avanzado. Todo el CSS necesario para estas herramientas se engloba en un archivo CSS que al incluir en nuestra página dará formato a nuestros objetos jQuery. Para poder crear los ficheros CSS e imágenes que utilizaremos en nuestros scripts y páginas webs, jQuery suministra una aplicación web: themeroller. Podemos acceder a ella desde esta url: http://ui.jquery.com/themeroller.

Cuando estemos en la página de themeroller podemos elegir entre configuraciones predefinidas (en la pestaña gallery -ver siguiente figura-) o crear la nuestra propia. En la parte derecha se muestra un ejemplo de cada uno de los elementos a los que afectará nuestro tema (botones, barras de desplazamiento, iconos etc...). Una vez hayamos realizado nuestra selección, pulsaremos sobre el botón de “download theme” y bajaremos un fichero comprimido con todos los archivos necesarios.

Si descomprimimos el zip descargado, encontraremos un carpeta “CSS”, en ella esta el fichero .css (pj: jquery-ui-1.8.17.custom.css) y una carpeta “images”. La carpeta “images” siempre debe de estar en el mismo directorio en el cual pongamos el archivo CSS.