blob: 3d281d36c6a13b08ce5fb256499d6d8ead17d8e2 (
plain)
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
|
document.addEventListener('DOMContentLoaded', function (event) {
const canvas = document.getElementById('canvas')
if(event?.target?.body?.clientWidth > 575) {
const r = new rive.Rive({
src: '/img/banner-bubbles.riv',
canvas: document.getElementById('canvas'),
autoplay: true,
stateMachines: 'State Machine 1',
onLoad: () => {
r.resizeDrawingSurfaceToCanvas()
},
})
canvas.classList.add('canvas-present')
}
addEventListener('resize', (e) => {
if (!e?.currentTarget?.innerWidth) return
if (Number(e?.currentTarget?.innerWidth) > 575) {
if(canvas.classList.contains('canvas-present')) {
return
}
canvas.classList.remove('not_visible')
canvas.classList.add('canvas-present')
const r = new rive.Rive({
src: '/img/banner-bubbles.riv',
canvas: document.getElementById('canvas'),
autoplay: true,
stateMachines: 'State Machine 1',
onLoad: () => {
r.resizeDrawingSurfaceToCanvas()
},
})
} else {
canvas.classList.add('not_visible')
}
})
})
|
