Diamo prima un'occhiata ai rendering:
Facile da usare:
Passo 1: Copia la cartella dei modelli, la cartella dei temi, la pace.js pace.min.js nel progetto
Passo 2: Introdurre stili CSS e script JS
- <div><link href="/Content/pace/themes/pace-theme-center-atom.css" rel="stylesheet" /></div><div><scrip{过滤}t src="/Content/pace/pace.min.js"></scrip{过滤}t></div>
Passo 3: Apri la pagina e hai finito
Configurazione personalizzata
Pace.js verranno caricati automaticamente nella pagina, senza bisogno di collegarsi a nessun codice, e il progresso verrà rilevato automaticamente. Se vuoi apportare qualche aggiustamento, puoi impostare window.paceOptions per personalizzare la configurazione:
- <div> paceOptions = {</div><div> // Disable the 'elements' source</div><div> elements: false,</div><div> </div><div> // Only show the progress on regular and ajax-y page navigation,</div><div> // not every request</div><div> restartOnRequestAfter: false</div><div> }</div>
Puoi anche inserire impostazioni personalizzate nel tag scrip{filter}t, ad esempio:
- <scrip{过滤}t data-pace-options='{ "ajax": false }' src='pace.js'></scrip{过滤}t>
Se usi AMD o Browserify per caricare moduli, puoi configurarlo così (ad esempio start):
- <div>define(['pace'], function(pace){</div><div> pace.start({</div><div> document: false</div><div> });</div><div>});</div><div></div>
Usa l'API
Elenco delle API Pace.js pubbliche:
Pace.start: Inizia a mostrare la barra dei progressi; se non usi AMD o Browserify per caricare i moduli, questo verrà eseguito di default.
Pace.restart: La barra di progresso si ricarica e viene visualizzata.
Pace.stop: nasconde la barra di avanzamento e smette di caricare.
Pace.track: Monitora una o più richieste di attività.
Pace.ignore: Ignora una o più richieste di attività.
Download file:
pace-0.5.6.zip
(153.26 KB, Numero di download: 2)
|
Pubblicato su 18/01/2016 11:02:55
|
|
|
|
