Katsotaanpa ensin renderöintiä:
Helppokäyttöinen:
Vaihe 1: Kopioi mallipohjakansio, teemakansio, pace.js pace.min.js projektiin
Vaihe 2: Ota käyttöön CSS-tyylit ja JS-skriptit
- <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>
Kopioi koodi
Vaihe 3: Avaa sivu ja olet valmis
Mukautettu kokoonpano
Pace.js ladataan automaattisesti sivulle, ei tarvitse kytkeä koodiin, ja eteneminen havaitaan automaattisesti. Jos haluat tehdä joitain säätöjä, voit asettaa window.paceOptionsin mukauttaaksesi asetuksia:
- <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>
Kopioi koodi
Voit myös laittaa mukautettuja asetuksia scrip{filter}t-tunnisteeseen, esimerkiksi:
- <scrip{过滤}t data-pace-options='{ "ajax": false }' src='pace.js'></scrip{过滤}t>
Kopioi koodi
Jos käytät AMD:tä tai Browserifyta moduulien lataamiseen, voit asettaa sen näin (esim. käynnistä):
- <div>define(['pace'], function(pace){</div><div> pace.start({</div><div> document: false</div><div> });</div><div>});</div><div></div>
Kopioi koodi
Käytä API:a
Lista julkisista API Pace.js luvuista:
Pace.start: Alkaa näyttää edistymispalkkia, jos et käytä AMD:tä tai Browserifyta moduulien lataamiseen, tämä suoritetaan oletuksena. Pace.restart: Edistymispalkki latautuu uudelleen ja näyttää. Pace.stop: piilottaa edistymispalkin ja lopettaa latauksen. Pace.track: Seuraa yhtä tai useampaa pyyntötehtävää. Pace.ignore: Jätä yksi tai useampi pyyntötehtävä huomiotta.
Tiedoston lataus:
pace-0.5.6.zip
(153.26 KB, Latausten määrä: 2)
|