Vamos a echar un vistazo primero a los renders:
Fácil de usar:
Paso 1: Copia la carpeta de plantillas, la carpeta de temas, pace.js pace.min.js al proyecto
Paso 2: Introduce estilos CSS y scripts 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>
Paso 3: Abre la página y listo.
Configuración personalizada
Pace.js se cargará automáticamente en la página, no es necesario conectarse a ningún código, y el progreso se detectará automáticamente. Si quieres hacer algunos ajustes, puedes configurar windows.paceOptions para personalizar la configuración:
- <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>
También puedes poner ajustes personalizados en la etiqueta scrip{filter}t, por ejemplo:
- <scrip{过滤}t data-pace-options='{ "ajax": false }' src='pace.js'></scrip{过滤}t>
Si usas AMD o Browserify para cargar módulos, puedes configurarlo así (por ejemplo, iniciar):
- <div>define(['pace'], function(pace){</div><div> pace.start({</div><div> document: false</div><div> });</div><div>});</div><div></div>
Usa la API
Lista de APIs Pace.js públicas:
Pace.start: Empieza a mostrar la barra de progreso; si no usas AMD o Browserify para cargar módulos, esto se ejecutará por defecto.
Pace.restart: La barra de progreso se recarga y se muestra.
Pace.stop: oculta la barra de progreso y deja de cargar.
Pace.track: Supervisa una o más tareas de solicitud.
Pace.ignore: Ignora una o más tareas de solicitud.
Descarga de archivo:
pace-0.5.6.zip
(153.26 KB, Número de descargas: 2)
|
Publicado en 18/1/2016 11:02:55
|
|
|
|
