skim-preview

contents

• Usage
• Events
• Dependencies

The preview component alows for putting pins on contained media. This way the user can specify for example areas of interest.

Usage

<skim-preview>
  <img src="https://image.shutterstock.com/z/stock-photo-close-up-portrait-of-her-she-nice-attractive-lovable-cute-adorable-winsome-girl-with-two-buns-wear-1725508987.jpg"></img>
  <img src="https://miro.medium.com/max/2600/1*mtGIfXRPG2FG_zbKJhwWzA.png"></img>
  <video controls>
    <source src="https://www.w3schools.com/html/mov_bbb.mp4" type="video/mp4">
    <source src="https://www.w3schools.com/html/mov_bbb.ogg" type="video/ogg">
    Your browser does not support the video tag.
  </video>
  <img src="https://image.shutterstock.com/z/stock-photo-close-up-portrait-of-her-she-nice-attractive-lovable-cute-adorable-winsome-girl-with-two-buns-wear-1725508987.jpg"></img>
</skim-preview>

Events

Event	Description	Type
skimSelect	Emitted when a thumbnail is selected and returns the index	CustomEvent<Number>

Dependencies

Depends on

• ion-slides
• ion-slide
• ion-thumbnail

Graph

graph TD;
  skim-preview --> ion-slides
  skim-preview --> ion-slide
  skim-preview --> ion-thumbnail
  style skim-preview fill:#f9f,stroke:#333,stroke-width:4px

---

Built with StencilJS