SP background/overlay: Breakpoint for mobile/large images?


#1

How do I change the breakpoint for SP background images between large and mobile?

Ta.

EDIT: In case it needs css I want to change the breakpoint for an overlay image to 1000px.

I want it for the red header area here: https://www.mailshotmonkey.co.uk/new/contact/


#2

Not at my computer but think you do it via Advanced Background Sizing child stack.


#3

Good call, but no, sadly not :-(

I’ve even had a brainwave to use BP not SP, thinking the overlay will take it’s control from the breakpoints in BP, but that don’t work either.


#4

No, sorry the breakpoints are hard coded in the interests of performance (there are a huge number of things that use them).

I would however go with @habitualshaker’s solution and just change the background size a bit to keep it off the text while leaving the text left aligned until the actual breakpoint when you centre it.

You could of course use the vis child to control for both size and aspect ratio combined to show / hide your alternate backgrounds but position them using the adv position child rather than using the built in background/overlay. This seems a bit convoluted though.


#5

Might just do what I did for the home page: Two versions, one for bigger screens, one for smaller. Means a bit more code on the page (unless I use Agent) but in the real world, it’s not a biggie.

Cheers.

BTW: Missed an opportunity: “Sorry, that is not a feature of this stack”.

You’re kicking yourself, ain’t ya?