4 images, 4 breakpoints for the Home bloc

Besides duplicating the main bloc (Home), which may have several connected blocs or targets, and hiding the various viewports for each one of the four, how can each viewport have a different image?
I know this a little advance, so I calling upon the professional website developers.

Also is it possible to have different animations to elements on the difference breakpoints?

Hi @KBConcepts

You can add a custom class to the bloc, and then set a different image background using this custom class for each breakpoint.



Thanks @Eldar
Good suggestion. It’s easier said than done. It takes lots of tweaking to make it close to the Hero on the Desktop view.
Example how do I get rid of the white area below the image between the bloc below?


It happens because you set the width to 100%. Obviously, all pictures will have different dimensions and ratios, so if you want for all of them to be the same, you need to think about this as well.

I would recommend to get rid of 100% setting, and just concentrate to pre-editing images to look exactly how you want for them to appear.


1 Like

@Eldar because of that one piece of professional advise you will be happy to know that I went back and tweak each one of the breakpoints. Each image has a specific dimension set for the it’s viewport. I got some time yesterday to learn how to make it work.
I appreciate you taking the time to your thoughts.

I decided to open Solis and check out the 4 different breakpoints and I couldn’t believe it all Viewports show the Hero (Home) image. Sad thing is the Hero does not show in the Browser for any viewport. It may be a Bug in Bloc 3?