Posicionamiento de flecha en fancybox

Question

Tengo fancybox ejecutándose para mostrar publicaciones de blog en un iframe cuando se hace clic en el título desde un control deslizante. Me gustaría utilizar las flechas, pero el posicionamiento predeterminado de las flechas significa que (al menos en cromo) los botones cubren el área donde la barra de desplazamiento de la publicación del blog significa que el usuario no puede desplazarse.

Me gustaría cambiar la posición de las flechas para que estén a la izquierda y derecha de la caja de fantasía y no se superpongan en la caja, aunque no puedo encontrar una opción para esto. ¿Alguien puede ayudarme?

Answer 1

Página contiene colección de demos útiles - http://fancyapps.com/fancybox/#useful Parece que busca # 6 - http://jsfiddle.net/fhpZ5/

Answer 2

Puede usar CSS para cambiar la posición de las flechas y colocarlas donde desee.

Abra el archivo fancybox css (jquery.fancybox-1.3.4.css) y alrededor de la línea 145 encontrará los siguientes estilos CSS. Cambie la posición izquierda y derecha del valor predeterminado (0) a la posición donde desea que se muestre la flecha.

/* Line 145 (ish) of the fancybox css sheet */ 
#fancybox-left { 
    left: -50px; /* Default: 0 */ 
} 

#fancybox-right { 
    right: -50px; /* Default: 0 */ 
} 

El -50px debe tirar de las dos flechas justo fuera de la caja. Puede cambiar esto para colocar las flechas donde desee.

---

Actualización - V.2.0.3 Hoja de estilo de la caja de lujo.
En la versión V2, busque lo siguiente en la hoja de cálculo y cámbiela como se indica arriba.

/* Around line 117 in .css file */ 
.fancybox-prev { 
    left: 0; /* Change to -50px */ 
} 

.fancybox-next { 
    right: 0; /* Change to -50px */ 
}