Skip to main content
Version: v6

ion-img

shadow

Img is a tag that will lazily load an image whenever the tag is in the viewport. This is extremely useful when generating a large list as images are only loaded when they're visible. The component uses Intersection Observer internally, which is supported in most modern browsers, but falls back to a setTimeout when it is not supported.

Basic Usage

Properties

alt

Descriptionこの属性は、画像を説明する代替テキストを定義します。画像の URL が間違っている場合、画像がサポートされている形式の一つでない場合、または画像がまだダウンロードされていない場合、ユーザにはこのテキストが表示されます。
Attributealt
Typestring | undefined
Defaultundefined

src

Description画像のURL。この属性は <img> 要素では必須です。
Attributesrc
Typestring | undefined
Defaultundefined

Events

NameDescription
ionErrorimgの読み込みに失敗したときに発行されます。
ionImgDidLoad画像の読み込みが終了したときに発行されます。
ionImgWillLoadimg srcが設定されたときに発行されます。

Methods

No public methods available for this component.

CSS Shadow Parts

NameDescription
image内側の img 要素。

CSS Custom Properties

No CSS custom properties available for this component.

Slots

No slots available for this component.