Crestron Components Lib - Showcase App

Utility function subscribeInViewportChange

Utility function subscribeInViewPortChange

subscribeInViewPortChange(el:HTMLElement, callback):void

el is a HTMLElement that can be observed when ir enters or leaves the viewport

callback is to be executed when the element enters or leaves the viewport. callback params el: HTMLElement, isInViewport: boolean

See the JS tab for the code

Here it will be displayed if the element with id #first is in viewport or not

Here it will be displayed if the element with id #second is in viewport or not

<p>See the JS tab for the code</p>

<div class="mb bordered">
    <p id="first"></p>
</div>

<div class="mb">
    <ch5-image
        id="ex1-img"
        refreshRate="5"
        class="img"
        appendclasswheninviewport="image_is_in_viewport"
        url="https://picsum.photos/200/300/?random">
    </ch5-image>
</div>

<div class="mt80 mb">
    <p>Here it will be displayed if the element with id #first is in viewport or not</p>
    <p id="firstResult" class="result"></p>
</div>

<div class="mb bordered">
    <p id="second"></p>
</div>

<div class="mt80">
    <p>Here it will be displayed if the element with id #second is in viewport or not</p>
    <p id="secondResult" class="result"></p>
</div>