Fancybox 2.1.5'deki özel düğmelerle varsayılan denetimler nasıl değiştirilir?

Fancybox 2.1.5 Varsayılan denetimleri özel düğmelerim (yeni ön yükleyici + yakın/sonraki/önceki düğmeler üzerinde prev düğmeleri) ile değiştirmek istiyorum.Fancybox 2.1.5'deki özel düğmelerle varsayılan denetimler nasıl değiştirilir?

Css kodunu düzgün bir şekilde nasıl ayarlayacağımı bilmiyorum. CSS as follows'u değiştirmeyi denedim ancak yanlış bir şey var, 'next' simgesi 'close' düğmesi yerine sağ üst köşede görünür.

Kodumu this gist adresinde görebilirsiniz.

kaynak

2013-08-31 triwo

orijinal CSS dosyası ile uğraşmak gerek yok, bunun yerine bu yüzden kendine özgü CSS özellikleri, arka plan resmi ayarlayabilirsiniz sınıf myClose eklendi

$(".fancybox").fancybox({ 
    tpl: { 
     closeBtn: '<a title="Close" class="fancybox-item fancybox-close myClose" href="javascript:;"></a>' 
    } 
});

Bildirimi gibi tpl API seçeneğini kullanın vb gibi

.myClose { 
    height: 50px; 
    width: 50px; 
    background: #ff0000; 
}

sadece bir örnek olarak JSFIDDLE bakınız.

Önceki/sonraki simgeler için de aynısını yapın. İpuçları için API documentation (search for tpl)

kaynak

2013-09-01 08:17:36 JFK

'u kontrol edin. Ancak bu, sadece küçük ve basit olan CSS dosyasını düzenlemekten çok daha karmaşık görünüyor. Prestashop'ta Fancybox eklentisi kullanılmaktadır. Bunun için tpl dosyasının gerekli olduğunu bilmiyorum. Bence prestashop şablonunu değiştirmek daha karmaşık olacaktır. Jquery.fancybox.css dosyasını değiştirdim, sadece gerektiği gibi çalışıyor, örnek: http://codepad.org/NXqQL6a0. Burada bazı detaylar hakkında emin değilim: “margin-top: -22px; kenar boşluğu: -22px; (satır 88,89) ve kenar payı: -15px; (satır 137) '- orijinal düğmeler boyutuna veya onlardan bağımsız olarak bağlı bu değerler mi? – triwo

@triwo the prestashop, fancybox'ı güncellemeye karar verir, daha sonra css dosyasını tekrar özelleştirmeniz gerekir. Bu neden orijinal dosyalar ile uğraşmak için iyi bir fikir değildir (ama size kalmış) ... ve 'tpl' bir dosya değildir, özel fantezi kutusu başlatma komut dosyasında kullandığınız bir seçeneği geçersiz kılmak için kullandığınız bir seçenektir. Değiştirmeden CSS dosyası. – JFK

Özel fancybox başlatma komut dosyasını deneyeceğim ama şimdi sadece CSS modlarıyla tamamlamak ve sorumu yanıtlamak istiyorum. – triwo

Fancybox 2.1.5'deki özel düğmelerle varsayılan denetimler nasıl değiştirilir?

cevap

İlgili konular