XHTML Archives - Page 3 of 4

fleXcroll: scroll bars personalizados para tu web

ByLuis July 27, 2006

LibrerÃa que nos permite usar scrolls personalizados en nuestras pÃ¡ginas web, ya sean verticales u horizontales. Aunque hay que intentar que no aparezcan en nuestra pÃ¡gina, en caso de que sea necesario, porque los hay que son totalmente necesarios, quizÃ¡s se puedan personalizar con este script.

Por lo poco que he visto del cÃ³digo (que no estÃ¡ fÃ¡cil de seguir porque estÃ¡ ofuscado), veo que fija el tamaÃ±o de la capa y con la propiedad overflow muestra los scrolls. Dibuja los scrolls personalizados encima y mediante ellos realiza el scroll de la capa, usando scrollTop y scrollLeft (que creo que antes no funcionaba del todo bien en Opera 8 y en la versiÃ³n 9 lo han solucionado). Algo que yo no solÃa hacer y que he visto como lo hace aquÃ, es capturar el evento selectstart y hacer que devuelva false, para que cuando se haga el drag del scroll no se seleccione la imagen que usamos para personalizar el control.
FleXcroll, Flexible and Accessible Custom Scroll Bars
VÃa / aNieto2K

Laboratorio: control para direcciones IP

ByLuis July 14, 2006

Algo que me suele gustar bastante es que cuando tengo que introducir una direcciÃ³n IP en un formulario o ventana de Windows, no tenga que estar dÃ¡ndole al tabulador para cambiar de caja de texto. Lo mismo es aplicable cuando se trata de un serial number. Tambien suelo agradecer que hacer un copy/paste, no tenga que ir haciÃ©ndolo caja a caja.

Siempre viene bien hacernos un control para direcciones IP, que permita pegar toda la direcciÃ³n ip y que se rellenen las cajas correctamente y que al pulsar el punto se mueva de caja, y la verdad es que tampoco es muy difÃcil de hacer.

Trucos | XHTML

Vídeos sin el elemento embed

ByLuis July 11, 2006

Incluir vÃdeos, del tipo que sean, en nuestras pÃ¡ginas web suele traernos dificultades, sobre todo si queremos que sean vistas en cualquier navegador y si queremos seguir los estÃ¡ndares. Si os encontrÃ¡is con este problema nada mejor que echarle un ojo a este artÃculo, en el cual se indica como incluir mediante el uso de la etiqueta object vÃdeos de distintos formatos, ya que embed no es estÃ¡ndar.
Entre los distintos tipos de vÃdeos que incluye estÃ¡n los que usa el Flash Player, como YouTube o Google Video, pelÃculas en formato Windows Media y QuickTime.
Ya no tienes excusa para seguir los estÃ¡ndares.
Bye, Bye <embed>

AJAX | MYSQL | PHP | WordPress | XHTML

AJAX paso a paso: paginación de entradas para WordPress

ByLuis May 25, 2006

Siguiendo con AJAX, hoy vamos a realizar un ejemplo que puede ser Ãºtil para los usuarios de WordPress. Se trata de un marco que muestra una lista con las entradas de nuestro blog, con paginaciÃ³n y efecto de fundido para darle mÃ¡s vistosidad.

AJAX | css | Firefox | Javascript | XHTML

Nueva versión de FireBug

ByLuis May 25, 2006

Ya hablamos en su dÃa de FireBug, una extensiÃ³n que nos permite depurar nuestras aplicaciones web. La nueva versiÃ³n tiene una gran novedad, “debuguear” Javascript. Ahora es posible poner puntos de ruptura, ejecutar el cÃ³digo paso a paso, inspeccionar variables, comprobar cÃ³digo, … Si antes ya era indispensable, ahora es totalmente obligatorio para cualquier desarrollador (vale, quizÃ¡s me he pasado). A parte de el debugger hay otra serie de cambios que no dejan de tener importancia.
FireBug
VÃa / SitePoint

css | Negocios | XHTML

Se vende StyleGala

ByLuis May 18, 2006

Las noticias en el mundo del CSS y Showcases durante la Ãºltima semana no han sido muy buenas que digamos. Ayer nos enterÃ¡bamos que Web Standards Awards cierra sus puertas despuÃ©s de casi 2 aÃ±os y Ãºnicamente 100 screenshots seleccionados.
Hace apenas unas horas leemos que la archiconocidÃsima Stylegala tambiÃ©n estÃ¡ en venta igual que CSS Vault en su dÃa y Unmatched Style. MÃ¡s bien en un cambio de dueÃ±o a travÃ©s de una subasta que empieza a partir de 30.000$ en el que uno de los factores estrella es que gana en publicidad unos 2400 dÃ³lares al mes, aunque desde hace 6 meses tiene un ritmo de publicaciÃ³n de 1 pÃ¡gina al mes.
DiseÃ±orama tambiÃ©n habla del asunto y se pregunta quÃ© futuro tienen los CSS Showcases.
A esta pregunta no podemos ser objetivos, y sabemos y somos conscientes de la rentabilidad, ademÃ¡s de que nos divertimos mucho no solo manteniÃ©ndola sino sabiendo que es muy Ãºtil para todos los profesionales y aficionados del sector disipando cualquier complejo que la comunidad hispana pudiera tener en cuanto al saber hacer.
Deseamos muchÃsima suerte a David en su subasta y que los prÃ³ximos dueÃ±os vengan con las pilas cargadas porque nosotros seguiremos innovando.

css | Grafismo | XHTML

Cómo crear márgenes según un contorno

ByLuis April 3, 2006

Hace unos días comentábamos sobre cómo realizar márgenes redondeados, prometimos al final de la entrada que íbamos a explicar paso a paso el proceso, por si hubiera alguien que le pudiera parecer insuficiente lo que se contaba en el artículo.

Se trata de colocar una imagen como fondo de un párrafo, si es necesario, se retocará para que tenga el fondo transparente o del mismo color que el fondo de la página, luego se crearán elementos html que se colocarán encima de la imagen del fondo, para evitar que se escriba el texto encima.

Apache | Especiales | MYSQL | PHP | XHTML

Especial UTF-8 (I)

ByLuis March 30, 2006

El UTF-8 es un tipo de codificación de caracteres para Unicode que nos permite escribir nuestras páginas web y no preocuparnos por si se va a ver correctamente o van a aparecer caracteres extraños.

Las veces que he trabajado en proyectos multilenguaje es lo que hemos usado, salvo en el caso de japonés y coreano que es preferible usar el UTF-16 porque ocupa menos espacio. Eso ha hecho que me haya acostumbrado a realizar siempre los proyectos en UTF-8 y así evitar luego los problemas que puedan surgir en futuras actualizaciones o en testeos y tener luego que cambiar todo el proyecto a UTF-8.

Recursos para crear bordes redondeados

ByLuis March 30, 2006

Para aquellos que quieran usar bordes redondeados y no se vean capaces de hacerlo, pueden usar varias herramientas.

Una de ellas, es Nifty Corners Cube. Sólo se necesita importar un script, importar una hoja de estilos y realizar una llamada Javascript.

Otra opción, quizá más sencilla y que nos gusta especialmente, es el generador de cajas de bordes redondeados de los catalanes de Neurotic Web. Solo tienes que elegir los colores y te genera automáticamente el código CSS y XHTML. Después subes las imágenes a tu servidor cuidando que la ruta del código de las imágenes en la CSS coincida y listo.

Y por último, Spiffy Corners, el más reciente en aparecer. Otro generador que te lo da todo con la novedad de que no incluye javascript ni imágenes para los bordes redondeados.

Para conocer otras opciones, un post a estas alturas ya muy leído pero que quizá no conozcas: CSS Rounded Corners ‘Roundup’.

Accesibilidad | How to | Javascript | XHTML

Scrolling usando thumbnail

ByLuis March 28, 2006

En esta entrada vamos a explicar cómo desarrollar un scrolling de texto usando para ello una miniatura del texto que se va a mostrar. Dispondremos de una capa con el texto y otra capa con la minuatura del texto, la cual remarca que parte del texto se está enseñando.

Este efecto ha sido testeado en IE6 y en Firefox 1.5 bajo Windows XP, en Opera es posible que no funcione debido a un bug que lleva arrastrando bastante tiempo.

Read More “Scrolling usando thumbnail”