Foros del Web » Creando para Internet » Diseño web »

¿Cómo lograr este efecto?

Estas en el tema de ¿Cómo lograr este efecto? en el foro de Diseño web en Foros del Web. Hola me gustaría saber, ¿Cómo lograr el efecto de la página:"http://www.apple.com/es/safari/", tienen la imagen de fondo que se ve encima de la imagen de fondo, ...
  #1 (permalink)  
Antiguo 24/01/2009, 08:23
 
Fecha de Ingreso: septiembre-2008
Mensajes: 221
Antigüedad: 9 años, 2 meses
Puntos: 1
¿Cómo lograr este efecto?

Hola me gustaría saber, ¿Cómo lograr el efecto de la página:"http://www.apple.com/es/safari/", tienen la imagen de fondo que se ve encima de la imagen de fondo, es decir, hay más de una imagen de fondo, varias por así decirlo, pero se tratan individualmente, un ejemplo:

1. Fondo general: images.apple.com/euro/safari/images/background20070611.gif
2. Fondo de la descripción de safari: images.apple.com/euro/safari/images/box_bg20070611.gif
3. Fondos de las barras de los navegadores, estas imagenes están fraqmentadas y luego les dan la orden de repetir en el eje X, pero hasta determinado punto, nose si estoy mal, detallen porfavor:

Barra azul (Safari): images.apple.com/euro/safari/images/sidegraph_bar1bg20070611.gif
Barra naranja (Firefox): images.apple.com/euro/safari/images/sidegraph_bar2bg20070611.gif[/url]
Barra amarilla (Internet Explorer): images.apple.com/euro/safari/images/sidegraph_bar3bg20070611.gif

Barra roja (Opera):
images.apple.com/euro/safari/images/sidegraph_bar4bg20070611.gif

Y más aún, creo que es un Js (Javascript, nose, una idea), porque he revisado el código fuente de la página y no he hallado las imagenes descritas en él código.

Una cuestión adicional es la de: "images.apple.com", ¿Cómo puedo lograr crear: "images.midominio.com"?

Espero ser lo suficientemente descriptivo. (He quitado los HTTP, porque no me dejan )

Gracias de antemano por su ayuda.
  #2 (permalink)  
Antiguo 24/01/2009, 09:10
 
Fecha de Ingreso: noviembre-2006
Ubicación: Evergreen Street
Mensajes: 239
Antigüedad: 11 años, 1 mes
Puntos: 2
Respuesta: ¿Cómo lograr este efecto?

Si no ves las imágenes en el código fuente es porque están definidas por medio de CSS. En el código aparecen tres hojas de estilo
Código:
<link rel="stylesheet" href="/es/global/styles/base.css" type="text/css" charset="utf-8"> 
<link rel="stylesheet" href="/es/safari/styles/safari.css" type="text/css" charset="utf-8"> 
<link rel="stylesheet" href="/es/safari/styles/index.css" type="text/css" charset="utf-8"> 
   . 
y por ejemplo, en la Hoja de estilos base.css, en la línea 15 tiene definida una imagen de fondo:
Código:
#globalheader #globalsearch { background-image: url(http://images.apple.com/es/global/nav/images/globalnavbg0907.png); _background-image: url(http://images.apple.com/es/global/nav/images/globalnavbg0907.gif); background-repeat: no-repeat; } 
   . 
La dirección "images.apple.com" nos indica que images es un subdominio, que se puede crear desde el panel del control, es como crear una carpeta dentro de la raíz de tu sitio.
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 10:53.