Age Of Learning JavaScript SDK

Class: AoflPicture

@aofl/picture~ AoflPicture

serves as a container for zero or more and one elements to provide versions of an image for different display sizes.

new AoflPicture()

Creates an instance of AoflPicture.
Source:

Extends

  • AoflElement

Members

<static, readonly> is :String

Type:
  • String
Source:

<static, readonly> properties :Object

Type:
  • Object
Source:

Methods

<static> findMatchingSource( [sources])

Iterates through an array of sources and returns the first matching source.
Parameters:
Name Type Argument Default Description
sources Array <optional>
 []
Source:
Returns:
Type
Object

addSource(source)

addSource should be invoked by a slotted element and adds aofl-source elements as alternative sources for image besed on media attribute of aofl-source
Parameters:
Name Type Description
source String
Source:

disconnectedCallback()

Source:

render()

Source:
Returns:
Type
Object

setImg(img)

setImg should be invoked by a slotted and sets the aofl-img element as the main img element of aofl-picture.
Parameters:
Name Type Description
img HTMLElement
Source:

setMediaSrc( [source])

Set's aofl-picture's image source to the matching aofl-source media query.
Parameters:
Name Type Argument Default Description
source String <optional>
 this.defaultSrc
Source: