SissiUK Posted May 8, 2023 Share Posted May 8, 2023 Hi, I want to add the following code to my home page and create e folder .img - Can you please help me? <!DOCTYPE html> <html> <head> <title>AR Demo</title> <script src="https://aframe.io/releases/0.6.1/aframe.min.js"></script> <script src="https://jeromeetienne.github.io/AR.js/aframe/build/aframe-ar.js"></script> <script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script> <meta name="apple-mobile-web-app-capable" content="yes"> <script> // We're going to register a custom event listener through a-frame that will fire // whenever a marker has entered the camera view and is found through ar.js AFRAME.registerComponent('registerevents', { init: function() { var marker = this.el; // Element emits events when found and lost marker.setAttribute('emitevents', 'true'); marker.addEventListener('markerFound', function() { // Alright, a marker has been found. Let's get the video element var vid = document.getElementById('waterVideo'); // Make sure that the video a-frame object is visible document.querySelector('#water').setAttribute('visible', true); // Reset the video to the beginning and play it through vid.currentTime = 0; vid.play(); More information about WebAR can be found here. https://ar-js-org.github.io/AR.js-Docs/ Link to comment
SissiUK Posted May 8, 2023 Author Share Posted May 8, 2023 Hi, I want to add the following code to my home page and create e folder .img - Can you please help me? <!DOCTYPE html> <html> <head> <title>AR Demo</title> <script src="https://aframe.io/releases/0.6.1/aframe.min.js"></script> <script src="https://jeromeetienne.github.io/AR.js/aframe/build/aframe-ar.js"></script> <script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script> <meta name="apple-mobile-web-app-capable" content="yes"> <script> // We're going to register a custom event listener through a-frame that will fire // whenever a marker has entered the camera view and is found through ar.js AFRAME.registerComponent('registerevents', { init: function() { var marker = this.el; // Element emits events when found and lost marker.setAttribute('emitevents', 'true'); marker.addEventListener('markerFound', function() { // Alright, a marker has been found. Let's get the video element var vid = document.getElementById('waterVideo'); // Make sure that the video a-frame object is visible document.querySelector('#water').setAttribute('visible', true); // Reset the video to the beginning and play it through vid.currentTime = 0; vid.play(); More information about WebAR can be found here. https://ar-js-org.github.io/AR.js-Docs/ Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment