How do they do this Headline...

User 458539 Photo


Registered User
1,583 posts

Hey folks

https://www.regalpooldesign.com/

Below the banner where it says - Luxury Vacations In Your Own Backyard

Thanks all,

Byron
User 458539 Photo


Registered User
1,583 posts

Sorry - I get how you can place an image in the background and place copy over it. I was wanting to not use an image - You see how this one is copy and not an image. My pages tend to be image heavy and trying to cut back on that as much as I can. I suppose I could make that image a gif and low res it for effect but was hoping to do it with copy instead.

Thanks all

Byron
User 122279 Photo


Senior Advisor
14,447 posts
Online Now

My guess is, that they have a fixed BG image, and above that a transparent layer with the text. Having one bit of text half-way covering another might have been done with negative margins, perhaps some z-index. Anyway, it works in IE11, so it can't be anything advanced. ;)
Ha en riktig god dag!
Inger, Norway

My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com


User 283347 Photo


Registered User
388 posts

there are some codepens available that do that.

just fyi
Mark
User 187934 Photo


Senior Advisor
20,181 posts

Inger wrote:
My guess is, that they have a fixed BG image, and above that a transparent layer with the text. Having one bit of text half-way covering another might have been done with negative margins, perhaps some z-index. Anyway, it works in IE11, so it can't be anything advanced. ;)

Yes they used neg top margins.
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
User 458539 Photo


Registered User
1,583 posts

Wow what is a codepen?????
User 283347 Photo


Registered User
388 posts

codepen.io

here is one example https://codepen.io/jayrebing/pen/VGrmNz

when you go there search "shrinking nav bar" there are several examples...some easier than others to modify.
Good luck!
Mark
User 458539 Photo


Registered User
1,583 posts

Sorry - not describing the right area on the page.

Look further down under the top 50 wirte letters on the blue banner. It says in the background WHY REGAL POOLS with Luxury Vacations In Your Own Backyard over the top of it

Thanks

Byron
User 187934 Photo


Senior Advisor
20,181 posts

Neg top margin on the Luxury Vacations In Your Own Backyard div
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
User 187934 Photo


Senior Advisor
20,181 posts

Look at this.
Attachments:
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.