GalleryView immagini Provino nel pannello
-
20-09-2019 - |
Domanda
Sto cercando di aggiungere pellicola alla galleria di foto utilizzando GalleryView plug-in, versione 2.0. Ho un problema che le immagini specificati in pellicola (immagini in miniatura) vengono visualizzate in un pannello di al posto dell'immagine specificato in div (class = "panel").
Come si vede dagli esempi e documentazione, pellicola personalizzato può essere aggiunto nel seguente modo:
<ul class="filmstrip">
<li><img src="img/gallery/frame-01.jpg" alt="Effet du soleil" title="Effet du soleil" /></li>
<li><img src="img/gallery/frame-02.jpg" alt="Eden" title="Eden" /></li>
</ul>
La mia galleria si presenta così:
<div id="gallery_wrap">
<div id="photos" class="galleryview">
<div class="panel">
<img src="/upload/pic/IMG_02740_orig.jpg" />
</div>
<div class="panel">
<img src="/upload/pic/IMG_02740_orig.jpg" />
</div>
<ul class="filmstrip">
<li>
<img src="/upload/pic/IMG_02739_thumb.jpg" alt="Effet du soleil" title="Effet du soleil" /></li>
<li>
<img src="/upload/pic/IMG_02739_thumb.jpg" alt="Eden" title="Eden" /></li>
</ul>
</div>
</div>
Quello che sto facendo male? Ho copia-incolla praticamente totale da esempio e non sta funzionando. Qualcuno implementare con successo questa sezione pellicola in GalleryView?
Come appare:
alt text http://img692.imageshack.us/img692/852/galleryviewfilmstripima .jpg
Si può chiaramente vedere che nel pannello è un pic miniatura invece della (foto totalmente diverso da quello delle miniature) originale.
Sto usando il seguente oggetto impostazione:
<script type="text/javascript">
$(function() {
$('#photos').galleryView({
panel_width: 800,
panel_height: 300,
frame_width: 100,
frame_height: 38,
transition_speed: 1200,
background_color: '#222',
border: 'none',
easing: 'easeInOutBack',
pause_on_hover: true,
nav_theme: 'custom',
overlay_height: 52,
filmstrip_position: 'top',
overlay_position: 'top'
});
});
</script>
Soluzione
Nel caso in questione è legato alla GalleryView 2.0 , per vedere i campioni esso, ci sono cambiamenti in preparazione elenco immagini: non è necessario utilizzare più le miniature ... Your'e descrizione galleria dovrebbe essere simile
<div id="gallery_wrap">
<ul id="gallery">
<li>
<span class="panel-overlay">Effet du soleil</span>
<img src="/upload/pic/IMG_02740_orig.jpg" />
</li>
<li>
<span class="panel-overlay">Eden</span>
<img src="/upload/pic/IMG_02740_orig.jpg" />
</li>
</ul>
</div>
In ogni caso, vedere GalleryView 2.0 esempio
Altri suggerimenti
E 'possibile avere miniature personalizzate:
<ul id="gallery">
<li><img class="panel-content" src="path/to/image" /><img src="path/to/thumbnail" /></li>
</ul>
ma a pannello overlay non funziona più. 5 secondi di lettura dei codici mi ha portato lì:)