Video responsiveness on devices smaller than tablet

SmashTapsOS / reactjs-videobg

Easily add background videos to react web apps

MIT License

50 stars 12 forks source link

Video responsiveness on devices smaller than tablet #5

Open Agent9G opened 5 years ago

Agent9G commented 5 years ago

Hi again guys,

I see in your VideoBg.module.css that you have 'display:none' set with a max-width of 768px, so basically tablets.

What's up with this?

I would like the background to show in mobile as well and likely have the ability to do a background-position: center center, or the like.

Also, your code in VideoBg.js relating to the wrapperClass and videoClass props is not quite clear, at least to me.

Do you think you could add those attributes to your demo, so one can quickly see how that works?

Agent9G commented 5 years ago

https://www.google.com/imgres?imgurl=https%3A%2F%2Fmedia0.giphy.com%2Fmedia%2F3og0IHWfN5Wx8WwqE8%2Fsource.gif&imgrefurl=https%3A%2F%2Fgiphy.com%2Fstickers%2Fimoji-hello-3og0IHWfN5Wx8WwqE8&docid=UV6juX-BSJDE9M&tbnid=6R-7WKvycIyIOM%3A&vet=10ahUKEwibqt6n27vkAhXgQUEAHc2QBV0QMwhvKAgwCA..i&w=546&h=636&bih=637&biw=1366&q=hello%20lionel%20richie&ved=0ahUKEwibqt6n27vkAhXgQUEAHc2QBV0QMwhvKAgwCA&iact=mrc&uact=8

JamesBotterill commented 4 years ago

@samAbeywickrama I'm also running into this.

natelandon commented 4 years ago

I had the same issue. I went into NodeModules folder and edited the bundle.esm.js, bundle.umd.js and bundle.cjs.js. It was set to display: none and I changed it to display: block; to get it to work properly on smaller screens.

Agent9G commented 4 years ago

I mentioned the issue in my first comment; but further clarification is good @natelandon

This is what I ended up making; except I did so without this: another-one-98483.web.app