File size: 1,708 Bytes
3c8b4f7
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
# Cover {.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>