La oss ta en titt på renderingene først:
Enkel å bruke:
Trinn 1: Kopier malmappen, temamappen, pace.js pace.min.js inn i prosjektet
Trinn 2: Introduser CSS-stiler og JS-skript
- <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>
Kopier koden
Steg 3: Åpne siden, så er du ferdig
Egendefinert konfigurasjon
Pace.js vil automatisk bli lastet inn på siden, det er ikke nødvendig å koble seg til noen kode, og fremdriften vil automatisk bli oppdaget. Hvis du vil gjøre noen justeringer, kan du sette window.paceOptions for å tilpasse konfigurasjonen:
- <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>
Kopier koden
Du kan også legge inn tilpassede innstillinger i scrip{filter}t-taggen, for eksempel:
- <scrip{过滤}t data-pace-options='{ "ajax": false }' src='pace.js'></scrip{过滤}t>
Kopier koden
Hvis du bruker AMD eller Browserify for å laste moduler, kan du sette det opp slik (f.eks. start):
- <div>define(['pace'], function(pace){</div><div> pace.start({</div><div> document: false</div><div> });</div><div>});</div><div></div>
Kopier koden
Bruk API-et
Liste over API-er Pace.js offentlige:
Pace.start: Begynner å vise fremdriftslinjen, hvis du ikke bruker AMD eller Browserify for å laste moduler, vil dette bli utført som standard. Pace.restart: Fremdriftslinjen lastes inn på nytt og vises. Pace.stop: skjuler fremdriftslinjen og slutter å laste. Pace.track: Overvåk én eller flere oppgaver med forespørsel. Pace.ignore: Ignorer én eller flere forespørslingsoppgaver.
Filnedlasting:
pace-0.5.6.zip
(153.26 KB, Antall nedlastinger: 2)
|