Pfeil Positionierung in Fancybox

Question

Ich habe fancybox ausgeführt, um Blog-Beiträge in einem iframe anzuzeigen, wenn der Titel von einem Schieberegler angeklickt wird. Ich möchte die Pfeile verwenden, aber die Standardpositionierung der Pfeile bedeutet, dass (zumindest in Chrome) die Schaltflächen den Bereich abdecken, in dem die Bildlaufleiste für den Blogpost bedeutet, dass der Benutzer nicht scrollen kann.

Ich möchte die Pfeile so positionieren, dass sie sich links und rechts von der Fancybox befinden und nicht über die Box selbst gelegt werden, obwohl ich dafür keine Option finden kann. Kann mir jemand helfen?

Answer 1

Homepage enthält Sammlung von nützlichen Demos - http://fancyapps.com/fancybox/#useful Sieht aus wie Sie für # 6 suchen - http://jsfiddle.net/fhpZ5/

Answer 2

Mithilfe von CSS können Sie die Pfeile neu positionieren und an beliebiger Stelle platzieren.

Öffnen Sie die fancybox CSS-Datei (jquery.fancybox-1.3.4.css) und um Linie 145 sollten Sie die folgenden CSS-Stile finden. Ändern Sie die linke und rechte Position von der Standardposition (0) zu der Position, an der der Pfeil angezeigt werden soll.

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

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

Die -50px sollte beiden Pfeile kurz vor dem Strafraum ziehen. Sie können dies ändern, um die Pfeile dort zu platzieren, wo Sie möchten.

---

Update - V.2.0.3 Fancy Box Style Sheet.
In der V2-Version suchen Sie im css-Blatt nach dem Folgenden und ändern Sie es wie oben entsprechend.

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

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