Porcentaje de carga mediante CSS

Blogs Media: CSS Mania | VivirLatino | Sentido Web | Apps Mania

Lun21Ene2008

Porcentaje de carga mediante CSS

11:00 H (CET)| Temas: CSS

Uno de los controles más usados en el desarrollo de animaciones Flash es el que muestra el porcentaje de carga de un elemento. Si queremos desarrollarlo mediante CSS nos puede venir muy bien este ejemplo.

Usando este código HTML:

<div id="box">
<div id="bar">50%</div>
</div>

y estos estilos:

#box{
  width:250px;
  border:1px solid #000;
  height:17px;
}
#bar{
  width:50%;
  background:#000 /* u otro background */;
  height:14px;
  color:#fff;
  text-align:right;
  padding:3px 0px 0px 0px;
}

podemos obtener ejemplos de progreso. Eso sí, esto luego habrá que cambiarlo mediante Javascript para que sea dinámico.

CSS Percentage Bars

Vía / Posh CSS

Relacionados

Recopilación de técnicas CSS (Martes, 15 Ene 2008)
Modificar el contorno del texto mediante CSS (Jueves, 10 Ene 2008)

Luis Sacristán

Abrir conversación | Del.icio.us

Sin comentar » Formulario

Participa | Navega con Firefox u Ópera

— Publicidad —

WHOIS!

Sentido Web es la publicación creada por Blogs Media dirigida a los desarrolladores web e internautas apasionados por la programación, diseño, negocios y todo lo que ocurre en Internet. La revista que siempre has querido leer y sin ir al kiosko.

About | Uso | Anúnciate