Önce renderlere bakalım:
Kullanımı kolay:
Adım 1: Şablonlar klasörünü, temalar klasörünü, pace.js pace.min.js projeye kopyalayın
Adım 2: CSS stillerini ve JS betiklerini tanıtın
- <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>
Adım 3: Sayfayı açın ve işiniz bitmiş
Özel yapılandırma
Pace.js otomatik olarak sayfaya yüklenir, herhangi bir koda bağlanmaya gerek kalmaz ve ilerleme otomatik olarak tespit edilir. Bazı ayarlamalar yapmak isterseniz, windows.paceOptions ayarlarını ayarlayarak yapılandırmayı özelleştirebilirsiniz:
- <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>
Ayrıca scrip{filter}t etiketine özel ayarlar da koyabilirsiniz, örneğin:
- <scrip{过滤}t data-pace-options='{ "ajax": false }' src='pace.js'></scrip{过滤}t>
Modülleri yüklemek için AMD veya Browserify kullanıyorsanız, bunu şu şekilde ayarlayabilirsiniz (örneğin başlat):
- <div>define(['pace'], function(pace){</div><div> pace.start({</div><div> document: false</div><div> });</div><div>});</div><div></div>
API'yi kullanın
Halka açık Pace.js API'ler listesi:
Pace.start: İlerleme çubuğu görünmeye başlıyor, modülleri yüklemek için AMD veya Browserify kullanmıyorsanız, bu varsayılan olarak çalıştırılıyor.
Pace.restart: İlerleme çubuğu yeniden yükleniyor ve görüntüleniyor.
Pace.stop: ilerleme çubuğunu gizler ve yüklemeyi durdurur.
Pace.track: Bir veya daha fazla istek görevini izleyin.
Pace.ignore: Bir veya daha fazla görev istemeyi görmezden gelin.
Dosya İndirme:
pace-0.5.6.zip
(153.26 KB, İndirme sayısı: 2)
|
Yayınlandı 18.01.2016 11:02:55
|
|
|
|
