Foros del Web » Programando para Internet » Javascript »

input file, problemas con el javascript y su apariencia

Estas en el tema de input file, problemas con el javascript y su apariencia en el foro de Javascript en Foros del Web. Muy buenas a todos y gracias por molestaros en leerme. Pensaba que este sería un problema de estilos pero ahora que he encontrado la solución ...
  #1 (permalink)  
Antiguo 31/08/2010, 05:02
Avatar de pann84  
Fecha de Ingreso: agosto-2010
Ubicación: Asturias - Madrid
Mensajes: 95
Antigüedad: 14 años, 3 meses
Puntos: 4
input file, problemas con el javascript y su apariencia

Muy buenas a todos y gracias por molestaros en leerme. Pensaba que este sería un problema de estilos pero ahora que he encontrado la solución 'o eso creo' parece que es en el javascript donde me atasco, y es que no tengo apenas ni idea (por no decir nada) de javascript. Os explico:

El diseñador me pasó un formularo con un campo <input type="file" /> de un diseño bastante determinado, el que se ve en la imagen que sigue:


Estuve tocando el CSS para modificar el estilo de este campo, pero no me fue posible, pues parece ser que los navegadores no permiten que se modifiquen estos campos por motivos de seguridad. Pero como hecha la ley, hecha la trampa, yo seguí buscando otras posibles vías para modificar la apariencia de este campo.

Me encontré con muchas y muy variadas soluciones, pero no completas. Lo que yo pretendía que el susodicho campo hiciese es lo normal en un campo file, que apareciese la ruta del archivo que el usuario acababa de insertar a la izquierda o que pudiese insertar la ruta a mano, y que el botón tuviese ese diseño de letra blanca y gris, con un hover. Pero no encontraba nada que hiciese algo así. Hasta que dí con la siguiente web:
[URL="http://www.albertlanchas.com/articulos/dar-estilo-a-un-boton-input-file"]http://www.albertlanchas.com/articulos/dar-estilo-a-un-boton-input-file[/URL]

Hace perfecta y exactamente lo que necesito, el problema es que soy incapaz de modificar de modo útil el diseño. Si toqueteo el CSS resulta que aunque cambia la apariencia, el botón no se corresponde con la imagen, y no soy capaz de que ya de mano aparezca un texto concreto.

Como podéis ver utilizan una galería de jquery, y por lo que he visto, tocan también desde ahí el aspecto, y yo por ahí ya me pierdo, si pudieseis indicarme, como cambiar la posición del botón para que esté a la derecha y no a la izquierda del campo que contiene la ruta del archivo como en la foto, y cómo hacer que de mano ya aparezca el texto 'Envía tu CV desde tu equipo' para desaparecer al insertar el archivo, os lo agradecería mucho. Pues yo en estos mundos javascriptianos me pierdo.

No os pongo el código, porque en la web que os puse ya viene todo listo para bajar, pero si no queréis bajarlo o lo que sea yo lo pongo sin ningún problema.

Espero haberme explicado

Muchas gracias de antemano
  #2 (permalink)  
Antiguo 31/08/2010, 05:43
Avatar de caricatos
Moderador
 
Fecha de Ingreso: abril-2002
Ubicación: Torremolinos (Málaga)
Mensajes: 19.607
Antigüedad: 22 años, 7 meses
Puntos: 1284
Respuesta: input file, problemas con el javascript y su apariencia

Hola:

Parece que tu fabuloso artículo, tan solo llama al método click que solo vale en explorer... en firefix, por ejemplo no hace nada, y usar una librería solo para maquillar un botón creo que es un gasto excesivo de recursos (tal vez también la uses para otra cosa...)

Mi consejo es que uses el botón normal, y le adviertas a tu cliente que no se puede cambiar.

Saludos
__________________
Por favor:
No hagan preguntas de temas de foros en mensajes privados... no las respondo
  #3 (permalink)  
Antiguo 31/08/2010, 06:52
Avatar de pann84  
Fecha de Ingreso: agosto-2010
Ubicación: Asturias - Madrid
Mensajes: 95
Antigüedad: 14 años, 3 meses
Puntos: 4
Respuesta: input file, problemas con el javascript y su apariencia

bueno, para mí fue fabuloso porque iba bien en principio, soy novata qué se le va a hacer. De todos modos estoy en prácticas, y no puedo modificar el diseño, me tengo que adaptar

Etiquetas: apariencia, file, input
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 09:30.