Recibo errores 404 con imágenes de Fancybox

Question

Recibo 404 errores en mi registro que tienen que ver con fancybox.

/products/product1/fancybox/fancy_shadow_se.png 
/products/product1/fancybox/fancy_shadow_ne.png 
/products/product1/fancybox/fancy_shadow_n.png 
/products/product1/fancybox/fancy_nav_right.png 
/products/product1/fancybox/fancy_close.png 

Se hace referencia a todos estos png en el archivo fancybox css. Por ejemplo:

.fancybox-ie #fancy-bg-n { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_n.png', sizingMethod='scale'); } 
.fancybox-ie #fancy-bg-ne { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_ne.png', sizingMethod='scale'); } 
.fancybox-ie #fancy-bg-e { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_e.png', sizingMethod='scale'); } 
.fancybox-ie #fancy-bg-se { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_se.png', sizingMethod='scale'); } 
.fancybox-ie #fancy-bg-s { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_s.png', sizingMethod='scale'); } 
.fancybox-ie #fancy-bg-sw { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_sw.png', sizingMethod='scale'); } 
.fancybox-ie #fancy-bg-w { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_w.png', sizingMethod='scale'); } 
.fancybox-ie #fancy-bg-nw { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_nw.png', sizingMethod='scale'); } 

He instalado FancyBox en este lugar:

/js/fancybox/ 

La caja viene todo bien y bonito.

¿Qué pasa? No puedo resolverlo. El CSS se ve bien y creo que lo he instalado en el lugar correcto. Una solución incorrecta sería colocar rutas absolutas en el archivo CSS. ¿Alguna otra idea?

Answer 1

Su url está buscando un directorio desde donde se ejecuta. Cambie su url relativa (../imagename.png si es solo un directorio hermano) o proporcione una ruta de acceso absoluta a sus imágenes.

Para aclarar, si su script se está ejecutando desde js/fancybox y especifica una imagen como /fancybox/image.png, buscará la imagen en js/fancybox/fancybox/image.png. Si la imagen está directamente en la carpeta de Fancybox en la que se encuentra su script, simplemente especifique el nombre de la imagen y no la anteponga con ninguna ruta relativa. Si especifica la estructura de su directorio, puedo darle una URL relativa mejor para usar, de lo contrario, la ruta totalmente calificada funcionará para usted.