Back to data overview

View Example 6: Inserting media files

Path to media files can be used the same way like other data attributes. But to prevent uneccessery requests to the placeholder mark, place the url inside the data-src attribut instead of src. SWAC than lazy loads the media files.

VIEW-Requestor

<div id="view_example6" swa="Present FROM ../../data/concepts/view_example6.json">
    <div class="swac_repeatForSet">
        <b>Image</b>
        <br><picture>
            <img data-src="{image}" height="200" width="200" alt="Image not loaded">
        </picture>
        <br><b>Audio</b>
        <br><audio controls>
            <source src="{audio}" type="audio/mp3">
        </audio>
        <br><b>Video</b>
        <br><video controls>
            <source src="{video}" type="video/mp4">
                    </video>
        </div>
</div>  
        
CONFIGURATION

No configuration needed

DATASOURCE
Image
Image not loaded
Audio

Video
Back to data overview