In our ‘Knowledge Base‘, you learned how to use HTML (basic) to interactive AR content elements by using basic Javascript, CSS and HTML coding
In this tutorial, you’ll learn how to use more advanced HTML to build stunning AR effects.
Change image src via button click
To change the src of the image you have to get the child because an augmentation creats a including and tag.
Change color of button after click
After clicking the button, the class “active” was added and the button toggles it color according to its status.
Play and Stop Video of Iframe API
When the button is clicked the YouTube element can be found with the id of the video
Start, pause, change src using set Timeout (Medium)
The first timeout starts the video after 3 seconds
Use APIs
Here is a lyrics API used which loads the lyrics of a song. After clicking the button with the cover of the CD the lyrics are shown.
Interact with 3D Objects
Similar to how you interact with YouTube videos there is a global variable on the window object
Best Practice - How to create an image gallery
Image galleries or "carousels" are very frequently used on many websites.
Embed Vimeo using HTML
Using Vimeo instead of YouTube to embed videos on WonderPages has some advantages.
Embed interactive map by using Google Maps
Open Google Maps in your web browser and search for a location.