Come cambiare la larghezza del navigatore di miniatura JSSOR

Question

Sto cercando di utilizzare la libreria di transizione JSSOR per avere le mie immagini che vengono visualizzate con i navigatori di miniature.

Ho visto le loro demo e hanno cercato di modificare alcune delle impostazioni per cambiare la larghezza della barra di navigazione mentre è in modalità verticale, ma non riesco a sembrare di indirizzare lo spazio vuoto all'interno di esso.

Tutto ciò che ho fatto cambia la dimensione dell'immagine della miniatura stessa, anche quando si ottiene l'elemento con gli strumenti per sviluppatori di Chromis, non posso cambiare la larghezza dell'elemento.

Ho allegato un'immagine per mostrare cosa intendo per lo spazio vuoto.

http://imgur.com/twslexs

Qual è il modo corretto per manipolare la larghezza di questa barra di navigazione in modo da poter smettere di avere spazi neri attorno alle miniature?

Answer 1

Ho ottenuto ciò che significa esattamente.

Si noti che il cursore è con "contenitore esterno", "contenitore di diapositive" e "contenitore del navigatore delle miniature". 'Slides Container' e 'Thumbnail Navigator Container' è nel "contenitore esterno".

Hai qualcosa di giusto.Successivamente è necessario regolare le dimensioni del "contenitore esterno" e regolare la posizione del "contenitore di diapositive"

Answer 2

Si prega di modificare la dimensione dell'elemento di navigazione miniatura,

<div u="thumbnavigator" class="jssort02" style="position: absolute; width: 240px; height: 480px; left:0px; bottom: 0px;">

.

Answer 3

Ci sono alcune opzioni per fare questo lavoro, come $ spacingx, $ spaziatura,

            $ThumbnailNavigatorOptions: {                       //[Optional] Options to specify and enable thumbnail navigator or not
                $Class: $JssorThumbnailNavigator$,              //[Required] Class to create thumbnail navigator instance
                $ChanceToShow: 2,                               //[Required] 0 Never, 1 Mouse Over, 2 Always

                $ActionMode: 1,                                 //[Optional] 0 None, 1 act by click, 2 act by mouse hover, 3 both, default value is 1
                $Lanes: 2,                                      //[Optional] Specify lanes to arrange thumbnails, default value is 1
                $SpacingX: 14,                                   //[Optional] Horizontal space between each thumbnail in pixel, default value is 0
                $SpacingY: 12,                                   //[Optional] Vertical space between each thumbnail in pixel, default value is 0
                $Cols: 6,                             //[Optional] Number of pieces to display, default value is 1
                $Align: 156,                          //[Optional] The offset position to park thumbnail
                $Orientation: 2                                //[Optional] Orientation to arrange thumbnails, 1 horizental, 2 vertical, default value is 1
            }

.