Foros del Web » Creando para Internet » CSS »

Posición vertical de un Background

Estas en el tema de Posición vertical de un Background en el foro de CSS en Foros del Web. Hola, Primero que nada, échenle un vistazo a esta pagina 3djuegos.com Si recorren el menú principal, verán que cada sección, el banner superior le muestra ...
  #1 (permalink)  
Antiguo 18/05/2009, 19:15
 
Fecha de Ingreso: marzo-2009
Mensajes: 30
Antigüedad: 8 años, 8 meses
Puntos: 0
Posición vertical de un Background

Hola,

Primero que nada, échenle un vistazo a esta pagina 3djuegos.com

Si recorren el menú principal, verán que cada sección, el banner superior le muestra un color diferente.

Se trata de una sola imagen (background) de 2 px de ancho con los diferentes colores incluidos a 73px de altos cada uno.

Esto se usa para evitar el tener que hacer un fondo para cada sección y que la misma no tarde mucho tiempo en cargar. Al cargar una sola imagen y cambiar de sección ya la imagen está presente.

La pregunta es… ¿Cómo se posiciona con CSS cada color un div partiendo de que estamos trabajando con una sola imagen y varios colores, queriendo destacar solo uno?

En los menús de imagen se usa también esta idea para evitar que dure unos segundos al cargar cada botón.

Saludos y gracias.
  #2 (permalink)  
Antiguo 18/05/2009, 19:49
Avatar de Triby
Mod on free time
 
Fecha de Ingreso: agosto-2008
Ubicación: $MX->Gto['León'];
Mensajes: 9.741
Antigüedad: 9 años, 4 meses
Puntos: 2113
Respuesta: Posición vertical de un Background

background-position:vertical horizontal; en tu caso:

background-position:-73px 0;

Solo haz tus pruebas para el resto.
__________________
- León, Guanajuato
- GV-Foto
  #3 (permalink)  
Antiguo 19/05/2009, 11:13
 
Fecha de Ingreso: marzo-2009
Mensajes: 30
Antigüedad: 8 años, 8 meses
Puntos: 0
Respuesta: Posición vertical de un Background

Gracias, Triby,

Encontré un tutorial que da una ejemplar explicación del tema, pero por politica del foro no puedo aún postear el URL de la página.
  #4 (permalink)  
Antiguo 19/05/2009, 14:18
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: Posición vertical de un Background

Esa técnica se conoce como "sprite"
Y recuerdo que en www.librosweb.es tienen una explicación clara y detallada sobre el particular.
__________________
Por una web con mucho estilo
+++ CUENTA ABANDONADA. ¿la quieres? +++
  #5 (permalink)  
Antiguo 19/05/2009, 16:41
 
Fecha de Ingreso: marzo-2009
Mensajes: 30
Antigüedad: 8 años, 8 meses
Puntos: 0
Respuesta: Posición vertical de un Background

Efectivamente, en esa misma web fue que vi la explicación.

Otra cosa... Saben ustedes como hacer que una imagen se encoja (achicar) dentro de un espacio y que se sigan viendo sus extremos?

Me explico.

En los menus, por ejemplo, se usan imágenes que se sustituyen por otras al posicionar el puntero del mause sobre ellas, dichas imágenes suelen ser algo grande horizontalmente y se ajustan al tamaño del texto que forma el link del menu.

¿Qué opciones se emplean en el CSS para adaptar esas imágenes para que tomen ese tamaño?
  #6 (permalink)  
Antiguo 19/05/2009, 16:51
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Respuesta: Posición vertical de un Background

Aquí tienes un ejemplo (pasa el ratón por las opciones). Verás que el fondo está adaptado a cada tamaño.
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 04:07.