Unable to troubleshoot the issue, any help would be appreciated.
Scroll down for the animation effect: http://diegocardenas.co/launch/ The script works across all screen resolutions.
When pasted into Webflow, it won’t resize the image and produces empty space on the right (resolutions over 1400px + mobile). Check out ignited.webflow.io and attached screenshot.
Script file: https://www.dropbox.com/s/zhyb2duwcsqchvk/rocket.zip?dl=0
The video element in your site has width: auto and height: 100%. It should be reversed like below:
element.style {
top: 0px;
width: 100%;
height: auto;
left: 0px;
}
That should get you the desired effect.
Hello @arb!
How is the elemtn.style being set? In the CSS I have the #video with 100% and I’m even trying to set the element.style in the custom code but it’s still being overwritten. Any way to hange this?
Thanks!
Hi Arb, your solution worked for the desktop version. Thanks! Any ideas how to fix things for the mobile version? There is empty space on the bottom this time.
On the reference site, the CSS is being managed by JavaScript. I don’t know anything about this library so I can’t really speak to how it’s implemented.
Try setting width and height to 100% on the mobile breakpoint? Just speculating here.