I was hoping to place a panorama image that is 8000px wide and wanting to scroll sideways on overflow. Webflow seems to limit the maximum width of any object to 2000px. Why?
I am wanting to create a div that is set to 100% of page width and 900px high.
Set the pano image to actual size (8000 x 900 px)
Set overflow width to scroll.
Webflow limits the image to a max width of 2000px so that is not possible.
I see a partial workaround if I set the pano mask to the 2000px limit and set my pano image to 400% width ( 2000px x 400% = 8000px), but with the max object 2000px limit imposed I don’t see a solution for the mask to be 100% of page width and control the width of the scroll path because they would only work if the browser window is 2000px or the pano image undershoots or overshoots scroll.
I cannot see any solution with the WF pixel limit that will allow you to build a simple side scrolling overflow element that works in a responsive container.
if you set the width of the browser below 2000px wide it won’t scroll the full width of the image on the fixed width mask and overruns the full width mask if wider than 2000.
One solution/cool thing that might also be a cool user experience would be to create a full-width/height slider. Split your panoramic image into 5 (or however many) slides/images and allow the user to navigate from one portion of the image at a time and adjust the transition time/effect to fit the feel you want. Example here: http://panoslider.webflow.com/
Plus this way you could easily add text and other elements, while also allowing it to be mobile friendly!
That is a great idea for mobile @Mat. It would be really easy to set the panos I have created to export as slices in Photoshop and they would fit together seamlessly. A slow transition does have a nice feel. Definately worth a shot. Thanks for the example and the suggestions!
