Tridi — Loading spinner

Tridi can display a loading spinner while preloading or updating images. To enable this, set spinner option to true.

Spinner requires CSS styles to work correctly. For basic styling see tridi.css.

Options

  • spinner (boolean) - enables / disables loading spinner. Optional, defaults to false

Code

HTML

<div id="tridi-spinner"></div>

CSS


.tridi-loading {
  /* Styles for loading overlay */
}

.tridi-spinner {
  /* Styles for loading spinner */
}

// You can also use container-specific classes generated by Tridi

.tridi-{element id or class}-loading {
  /* ... */
}

.tridi-{element id or class}-spinner {
  /* ... */
}

JavaScript

new Tridi({
  element: '#tridi-spinner',
  location: './path/to/image/folder',
  format: 'jpg',
  count: 36,
  spinner: true,
}).load();

« Back to main page