GalleryView images filmstrip dans le panneau

Question

Je suis en train d'ajouter filmstrip à la galerie d'image en utilisant GalleryView plug-in , version 2.0. J'ai un problème que les images spécifiées dans (images filmstrip miniatures) sont affichées dans un panneau au lieu de l'image spécifiée dans div (class = "panel").

Comme il ressort des exemples et de la documentation, filmstrip personnalisé peut être ajouté de la manière suivante:

<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>

Ma galerie ressemble à ceci:

<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>

Qu'est-ce que je fais mal? Je copier-coller essentiellement totale de l'exemple et il ne fonctionne pas. Est-ce que quelqu'un avec succès la mise en œuvre de cette section dans filmstrip GalleryView?

À quoi il ressemble:

texte alt http://img692.imageshack.us/img692/852/galleryviewfilmstripima .jpg

Vous pouvez voir clairement que dans le panneau est un pic miniature au lieu de l'original (image totalement différente de vignettes).

J'utilise l'objet de réglage suivant:

<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>

Answer 1

Juste en cause de cas est lié à GalleryView 2.0 , voir des échantillons pour il, il y a des changements dans les images préparation de la liste: vous ne devez plus utiliser les vignettes ... Your'e Description de la galerie devrait ressembler à

<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>

de toute façon, voir échantillon GalleryView 2.0

Answer 2

Il est possible d'avoir des vignettes personnalisées:

<ul id="gallery">
   <li><img class="panel-content" src="path/to/image" /><img src="path/to/thumbnail" /></li>
</ul>

panneau de recouvrement ne fonctionnera plus. 5 secondes de lecture de code m'a amené là-bas:)