C'è un modo semplice per forzare il browser a scorrere verso l'alto se si fa clic su un pulsante?Scorrere verso la parte superiore della pagina
ho cercato
jQuery('html').scrollTop();
jQuery('body').scrollTop();
jQuery(window).scrollTop();
Nessuno di loro sembra scorrere fino alla parte superiore della pagina.
A causa della stranezza del browser, alcuni browser risponderanno a 'html' e alcuni a 'body'. E forse è solo la mia fortuna, ma .scrollTop(0) non ha mai funzionato per me per spostare la pagina. Provate subito:
jQuery('html,body').animate({scrollTop:0},0);
Questa versione è testata e cross browser per tutti i browser desktop e dispositivi mobili.
Questo ha funzionato come un fascino. Non è stato in grado di farlo rompere in FF, IE o Safari. Non ho ancora controllato il cromo. Grazie! –
Btw, ho provato anche questo codice. Per me funziona. Ma pensavo che i trucchi di css siano un ottimo nome e potrebbero essere che hanno messo un lungo codice per una ragione :) Grazie per aver chiarito :) Ho amato anche la risposta di Mario :) – Jashwant
I trucchi CSS sono un blog a dondolo, da cui ho imparato molto, ma non riesco ancora a discuterne con loro a volte;) – Fresheyeball
È possibile utilizzare questo:
jQuery('body').scrollTop(0);
o questo:
jQuery(window).scrollTop(0);
o infine questo:
jQuery('html').scrollTop(0);
Così, al fine di chiamare il metodo scrollTop e rendere il vostro scorrimento della pagina si dovrebbe passare un argomento con il valore numerico che rappresenta la posizione scrollTop . Altrimenti funzionerà come se fosse necessario ottenere la posizione scrollTop.
Due ultimi metodi dovrebbero funzionare costantemente in tutti i browser, mentre il primo potrebbe non funzionare in alcune versioni di IE.
Non sono riuscito a far funzionare "body", ma "html" ha funzionato fino a quando sono passato a 0. Sapete se sono cross browser o quale versione non funziona per caso? –
@JamesWilson Vedere la mia risposta per una semplice soluzione cross browser. – Fresheyeball
@JamesWilson Dipende davvero. Puoi provare il metodo di Fresheyball ma senza animare, semplicemente: 'jQuery ('html, body'). ScrollTop (0);' – VisioN
Questo è il modo in cui cross browser,
function scrollableElement(els) {
for (var i = 0, argLength = arguments.length; i <argLength; i++) {
var el = arguments[i],
$scrollElement = $(el);
if ($scrollElement.scrollTop()> 0) {
return el;
} else {
$scrollElement.scrollTop(1);
var isScrollable = $scrollElement.scrollTop()> 0;
$scrollElement.scrollTop(0);
if (isScrollable) {
return el;
}
}
}
return [];
}
var scrollElem = scrollableElement('html', 'body');
$(scrollElem).scrollTop(0);
Codice da CSS-trucchi
Sai se questo metodo è migliore di quello di Fresheye in basso? Oppure fanno lo stesso per quanto riguarda la consistenza del browser? –
@JamesWilson fanno praticamente la stessa cosa, tranne che questo metodo passa attraverso il lavoro non necessario per determinare "body" o "html" prima di usarlo. Francamente è un sacco di codice aggiuntivo per la soluzione. – Fresheyeball
semplice javascript puro, funziona anche in mobili
window.scrollTo(0,0);
Poiché nessuno ha menzionato la richiesta HTML Lo aggiungerò qui.
Innanzitutto creare il vostro elemento di ancoraggio:
<a href="#" title="Scroll to Top" class="ScrollTop">Scroll To Top</a>
Nota classe viene fatto riferimento dal seguente jQuery.
Allora aggiungi la tua jQuery:
$(document).ready(function(){
$('.ScrollTop').click(function() {
$('html, body').animate({scrollTop: 0}, 800);
return false;
});
});
Per regolare la velocità dell'animazione cambiare il valore "800".
Questo perché [scrollTop()] (https://api.jquery.com/scrollTop/) non scorre effettivamente la pagina a meno che non venga fornito un valore; senza un valore restituisce semplicemente un valore in pixel che rappresenta la * posizione di scorrimento * come offset dal * top * della pagina. – Warpling