Spaces:
Running
Running
File size: 1,719 Bytes
8ed5f8a a67ae61 48cb32a a67ae61 9a5a10f 48cb32a a67ae61 48cb32a 8ed5f8a 48cb32a 8ed5f8a 48cb32a 9a5a10f 48cb32a 8ed5f8a 48cb32a 8ed5f8a 48cb32a 9a5a10f 48cb32a 8ed5f8a 3a238b7 48cb32a f4f6649 48cb32a 3a238b7 8ed5f8a |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 |
# Meet The Tornado {.unnumbered}
<!-- load dot lotti js code -->
<script src="https://unpkg.com/@dotlottie/[email protected]/dist/dotlottie-player.js"></script>
<!-- the riksha file is obtained through:https://lottiefiles.com/103030-rickshaw-from-pakistan
and https://lottiefiles.com/ranaadeelfarrukh -->
<dotlottie-player
autoplay
loop
mode="bounce"
src="./Data/7_Animation/Riksha.lottie"
style="width: 100% hegiht: 600px">
</dotlottie-player>
<div id="iframe_Tornado" style="display:none;"></div>
<script>
function createIframe() {
const iframe = document.createElement("iframe");
iframe.src = "./Data/6_Html_Data/0_Viz/mPV_16.78.html";
iframe.frameBorder = "0";
iframe.width = "100%";
iframe.height = "600";
return iframe;
}
function hide_Riksha() {
// get lottify riksha
const player = document.querySelector('dotlottie-player');
// get iframe container
const content = document.getElementById("iframe_Tornado");
// hide riksha
player.style.display = "none";
// show iframe container
content.style.display = "block";
}
// wait until the whole page has loaded once
window.addEventListener("load", function() {
console.log("whole page has loaded");
// create and insert iframe
const content = document.getElementById("iframe_Tornado");
const iframe = createIframe();
content.appendChild(iframe);
// hide riksha and show iframe when iframe content has loaded
iframe.addEventListener("load", function() {
console.log("iframe has loaded");
setTimeout(function() {
// code to be executed after 2.3 seconds
hide_Riksha();
}, 3300);
});
});
</script>
|