2012-02-21 23 views
5

Vorrei passare automaticamente a un particolare div quando la pagina viene caricata. Tuttavia, mi sembra di entrare in conflitto con la pergamena di JQM verso le migliori funzionalità.jQuery Mobile - scorrere fino a div specifico su pageload

Sto usando il seguente codice:

$.mobile.silentScroll($("#myElementId").offset().top); 

che non scorre correttamente quando avvolto come questo:

$('[data-role=page]').bind("pageshow", function() { 
    $.mobile.silentScroll($("#myElementId").offset().top); 
}); 

ma funziona correttamente con un po 'di timeout come questo:

$('[data-role=page]').bind("pageshow", function() { 
    setTimeout(function(){$.mobile.silentScroll($("#myElementId").offset().top);},100); 
}); 

il problema con l'ultimo pezzo di codice è che provoca uno sfarfallio, con un salto al p e poi un salto lungo la pagina. Qualche idea su come evitarlo?

risposta

2

vostri setTimeout opere perché il quadro jQuery Mobile ricorda dove si erano scorrere da se si sta tornando ad una pagina che hai visitato prima e si deve aspettare il loro scorrimento per completare prima di eseguire il proprio. È possibile disattivare essenzialmente questa funzione modificando l'opzione minScrollBack all'interno del gestore mobileinit evento per qualcosa di veramente grande:

<script src="[jQuery Core]"></script> 
<script> 
$(document).bind("mobileinit", function(){ 
    $.mobile.minScrollBack = 90000; 
}); 
</script> 
<script src="[jQuery Mobile]"></script> 

Questo dovrebbe disattivare l'auto-scroll che il framework jQuery Mobile non quando si visita una pagina su una visita successiva .

Documenti: http://jquerymobile.com/demos/1.0.1/docs/api/globalconfig.html

+0

Grazie Jasper, ma anche dopo aver aggiunto il codice tra jQuery core e JQM, non funziona ancora. Non penso che sia un problema con il minScrollBack, perché accade anche dopo un aggiornamento completo della pagina. A quel punto, JQM non dovrebbe essere in grado di ricordare dove fossi passato prima. – Steve

2

primo post su StackOverflow!

Grazie per questo, ho lavorato a un progetto che utilizza un po 'di animazione personalizzata per le transizioni e mentre ci è voluto un po' per arrivare qui, la risposta di Jasper mi ha indirizzato nella giusta direzione, mancava solo un bit di codice:

<script src="[jQuery]"></script> 
<script> 
$(document).bind("mobileinit", function(){ 
    $.extend($.mobile, { 
     minScrollBack: 90000 // turn off scrolling to position on last page 
    }); 
}); 
</script> 
<script src="[jQuery mobile]"></script> 

Questo sembrava fare il trucco!

Rif: http://jquerymobile.com/test/docs/api/globalconfig.html

0

Voi ragazzi mai provato la risposta ???

Non funziona a meno che non si imposti anche $ .mobile.defaultHomeScroll sullo scroll desiderato.

Cioè, due passaggi. 1. impostare $ .mobile.minScrollBack su un valore sufficientemente grande. 2. al caricamento della pagina, impostare defaultHomeScroll sul valore desiderato.

Quindi funziona.

0

Non ho dovuto fare molto ... L'ho ottenuto lavorando con quanto segue sulla sezione.

<script>$(function() {$.mobile.defaultHomeScroll = $(window).scrollTop();});</script> 
Problemi correlati