Estilo para los inputs type=file +
<input tye=”file” /> [w3School]
En Anieto2k acaban de publicar un post por mas interesante, se trata de la posibilidad de dotar de estilo a los inputs type=file (esos que sirven normalmente para subir archivos al server) utilizando CSS y Javascript, batante util ya que este elemento era el que le quitaba un poco el estilo a nuestros formularios, pero bueno aqui una alternativa.
HTML:
<label class=”cabinet”> <input type=”file” class=”file” /></label>
CSS:
.SI-FILES-STYLIZED label.cabinet{width: 79px;height: 22px; background: url(btn-choose-file.gif) 0 0 no-repeat; display: block; overflow: hidden; cursor: pointer; } .SI-FILES-STYLIZED label.cabinet input.file { position: relative; height: 100%; width: auto; opacity: 0; -moz-opacity: 0; filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0); }
Javascript:
<script type=”text/javascript” src=”/path/to/si.files.js”></script>SI.Files.stylizeAll();//oSI.Files.stylizeById(’input-id’);
Es compatible con IE5.5+, Firefox 1.5+, Safari 2+
Publica tu Comentario sobre este Articulo.
Mas Articulos, Relacionados:
- Fuentes gratis estilo web 2.0
- Galeria de imagenes en javascript estilo Mac
- Iconos estilo Windows Vista
- Tutorial: Dale estilo a tus lista <ul> <ol>
- Creando menus estilo Windows Vista en Web
- Menu estilo Mac, Lista de Mesnus Fish Eye OpenSource
- 120 logos con estilo
- Rediseño de la BBC estilo web 2.0
- Los secretos del diseño estilo Grunge
- Decora tu habitacion con mucho estilo
Suscribete al Feed
Agregar en Netvibes
Agregar en Bloglines
Agregar en Technorati
Agregar en iGoogle
Agregar en MyYahoo!
Meneame
StumbleUpon
Designios
DesignFloat
Del.Icio.Us
Digg
Mister Wong
Fresqui




0 Comentarios en “Estilo para los inputs type=file”
Aun no hay comentarios, envia el tuyo me interesa tu opinion.
Envia tu comentario