dkaoster / scrolly-video

Components for scroll-based (or other externally controlled) playback.
https://scrollyvideo.js.org/
MIT License
971 stars 39 forks source link

Update docs to more clearly indicate usage #52

Open MaximumMaxxx opened 1 year ago

MaximumMaxxx commented 1 year ago

Hello,

If you only rely on the documentation from NPM or the project's website, you might encounter a problem where the component appears broken because the container size isn't big enough. It would be a good idea to update the docs to include styling instructions, so that if someone copies the code, the project won't look broken.

Current docs: image

Proposed change: Screenshot 2023-07-05

MaximumMaxxx commented 1 year ago

Alternatively instead of inline styles you could add a section about styling and include the css like in the demo

<style>
    .scrolly-video-container {
        height: 300vh;
    }
</style>
tarsisexistence commented 7 months ago

@MaximumMaxxx isn't the proposed solution wrong in terms of applying height on the video (or canvas) element instead of the container?

We can probably highlight this for every usage in README by wrapping the scrolly video element with a container of 300vh.