How to add fully stretched image with parallax?
Hello! I am using the full width layout and my grid width is 1240 px .
When I set a "featured image" for a page, it automatically gets stretched nicely over the full screen (more than 1240 px) and also has a parallax effect. That looks great and now I would like more images on the page with the same effect...
I am using the muffin builder to add my images:
- Image size: Full size (it is 2000 px wide)
- Stretch: yes
But, the image stays in the 1240 px boundaries. So, I changed my grid width to 1920 px. Then, the image was wider, but still had a border of maybe 50 pixels (or so) left and right, it wouldn't stretch all the way.
What am I missing? And where do I turn parallax on for single images?
Here you can see my starting page (grid is back to 1240 px)
Thanks a lot!
Comments
Hello,
If you put your image as an item, it will always have a little margin on its sides.
To have an image fully stretched on your page, you should put this image as a Section background.
Also, to have a parallax effect, you should change the Background | Position to Parallax, but some people complained that the parallax effect stopped working after the recent update. We are taking a closer look at it, but you can also use position fixed instead.
Thanks
OK, that works for now, and yes, parallax doesn't work, but I am happy to wait for the next update.
But... In order to see the background image on the page, I am using the placeholder block. There is probably a better way for this... When I use too little (OR: too many!) placeholders, then the image automatically gets zoomed in and doesn't show the full picture. So, how do I do it that really the full image gets displayed as a background image with no zooming in?
Thanks a lot! :-)
You can use paddings for the section (top and bottom) instead too, but it won't solve your problem completely, but it will surely work better.
The best way will be by using "Image" item, it won't be stretched then, but it will look the most beauty as it can ;)
thanks