Website/components/trianglesbg.js

18 lines
953 B
JavaScript
Raw Normal View History

2021-12-22 18:59:23 +00:00
import { useState, useEffect } from "react"
2021-12-21 19:08:36 +00:00
export default function TrianglesBG() {
2021-12-22 18:59:23 +00:00
const [positionX, setPositionX] = useState(0);
// use setPositionX(123) to set the background-position-x to 123
useEffect(() => {
const interval = setInterval(() => {
// do magic here using setPositionX
setPositionX(positionX + 1);
}, 10);
return () => clearInterval(interval);
});
2021-12-21 19:08:36 +00:00
return (
<div style={{width: '100vw', height: '100vh', position: 'absolute', top: '0', left: '0', zIndex: '0', color: 'white'}} className="steve">
2021-12-22 18:59:23 +00:00
<div className="whatIsItso that means the proxy (that im about to )LikeInsideSteve" width='100%' height='99%' style={{objectFit: 'fill', imageRendering: 'pixelated', backgroundImage: 'url("/background.webp")', width: '100%', height: '100%', backgroundRepeat: 'repeat', backgroundSize: '100vw', backgroundPositionX: positionX}}/>
2021-12-21 19:08:36 +00:00
</div>
)
}