JScrollPane non funziona correttamente con contenuto nascosto

Ho installato jScrollPane sul mio sito Web e non riesco a farlo funzionare.JScrollPane non funziona correttamente con contenuto nascosto

Il mio sito Web funziona come segue: dalla pagina principale, le pagine vengono caricate in modo dinamico utilizzando il metodo load() di jQuery. Nella pagina che carico ho il seguente script per avviare jScrollPane:

$(function(){ 
    $('.scroll-pane').jScrollPane(); 
});

Che sembra essere chiamato. Nessun problema finora immagino. Il problema è che la pagina, all'inizio, non è abbastanza lunga da richiedere una barra di scorrimento. Ho dei contenuti nascosti che vengono visualizzati solo su azioni specifiche (ad esempio facendo clic su un pulsante viene visualizzato il contenuto di un determinato paragrafo) e quando faccio clic per mostrare il contenuto di un div nascosto, la barra di scorrimento non viene visualizzata.

Ho anche provato a chiamare $('.scroll-pane').jScrollPane(); come mostrare i nuovi contenuti (vale a dire nel caso in cui innesca .show() sul nascosta div chiamo anche $('.scroll-pane').jScrollPane();), ma non ho avuto successo con che o.

Qualcuno può aiutarmi?

Grazie

EDIT:

ho dimenticato di menzionare la struttura della pagina: Ho un div che ha class="scroll-pane" e viene caricato con il caricamento della pagina e contiene piccole div nascosti che appaiono quando si fa clic su particolari aree. Vorrei aggiungere una barra di scorrimento al div con il riquadro di scorrimento classe per rendere il contenuto del div mostrato scorrevole (in questo momento il contenuto rimane nella dimensione del div ma non è scorrevole poiché nessuna barra di scorrimento jScrollPane è mostrato).

Aggiornamento:

ho cercato di mettere $('.scroll-pane').jScrollPane(); nel callback del metodo dei miei div .show() e ho cercato di mettere class="scroll-pane" a quei div che appaiono, ma ancora una volta non appare nulla (la barra di scorrimento non viene visualizzata e il div non è scorrevole).

fonte

2012-01-28 Masiar

Se la barra di scorrimento non viene visualizzata quando si visualizza il contenuto nascosto, non sarà possibile scorrere. Il problema deve venire dall'HTML. I tuoi elementi HTML hanno una "posizione" o un "float" che li rende fuori dal flusso HTML? – dievardump

No davvero no, sono alle 'position: relative' nel mio CSS, rispetto al wrapper principale. È molto strano, se non scorre perché la barra di scorrimento non viene visualizzata, forse è una sorta di problema CSS. Darò un assegno al file CSS (quello che ho importato + quello che avevo già). – Masiar

controllare questa demo fornita dallo sviluppatore del plugin

http://jscrollpane.kelvinluck.com/invisibles.html

Quando l'elemento viene prima mostrato semplicemente necessario (ri) inizializzare il ScrollPane (o si potrebbe anche usare autoReinitialise se ti piace) e la sua larghezza e altezza saranno calcolati correttamente.

Tutto quello che serve è

$(function(){ 
    $('.scroll-pane').jScrollPane({autoReinitialise: true}); 
});

e può essere la versione recente del plugin

fonte

2012-01-29 06:46:53 Cheery

Grazie, in realtà ho usato quel pezzo di codice in seguito, ma poi ho scoperto qualche altro bug. Comunque grazie, avrebbe dovuto fare il lavoro :). – Masiar

È lavoro se il blocco del riquadro di scorrimento ha altezza. Cosa succede se questo blocco ha solo altezza massima? –

@Bohdan Non penso che potrebbe essere un problema, in quanto altezza e larghezza, in genere, calcolate in base alle dimensioni effettive dell'elemento padre. Puoi mostrarmi un esempio? – Cheery

suggerisco di utilizzare la proprietà visibilità css invece Reinizializzazione auto. Ogni volta che chiamate il metodo show(), jScrollPane si reinizializza automaticamente. Questo richiede tempo e ha un impatto sull'animazione.

Se si utilizzano, ad esempio, i metodi slide.(), L'animazione viene avviata correttamente, ma il contenitore scorrevole (ei relativi elementi) vengono visualizzati un po 'più tardi e ciò sembra negativo.

var wrapper = jQuery('#gallery-album-preview-wrapper'); 
if (wrapper.css("visibility") == "hidden") { 
    wrapper.css("visibility", "visible").css("display", "none"); 
} 
if (wrapper.is(":hidden")) { 
    wrapper.slideDown(1000); 
} else { 
    wrapper.slideUp(1000); 
}

fonte

2012-10-27 08:30:43 ruruskyi

JScrollPane non funziona correttamente con contenuto nascosto

risposta

Problemi correlati