glimmbo / tagg Goto Github PK

I think I'm loading/rendering the gif incorrectly, because the first hover event that renders the WorkThumb gif causes a size flicker. Subsequent hover events work as intended.

Currently all videos load at once, and all are playing (I think) regardless if visible. It seems like the client will whittle down the video count to 4, but I still want to set up proper loading for performance in case they increase the video count.

1.Load the first, and one on either side (second and last on first load)
2. Only play the one running
3. Bonus: fit the video all the way to the edge of the red box with no blank spaces

Goal here is to have a full screen landing, where the red borders encompass everything, minus some black space around the edge. Inside the carousel, the edges of the video go (as far as they can, within constraints of aspect ratio maintained by EmbedContainer) to the border.

I think the difficulty comes from the Vimeo request, and knowing the size needed before the page loads... but I'm not sure.

Currently the copy overflows the Content, making the it look squished to the next section below. Need the height to include all the content so the spacing looks right.

Overlay a component that externally controls the actions of the carousel.
http://react-responsive-carousel.js.org/storybook/?path=/story/02-advanced--with-external-controls

I think I'm using useIntersectionObserver incorrectly.. theinView event on all the svg animations causes the entire page to flash when starting the animation. Similar thing happens with the WhoWeAre section.