Is there any class name I can add to a header or div to add the hover effects the footers have? I know that certain things like giving it a link class will make it grow or adding hide-ball will make it hide. But is there any option like this for the ball to display text?

(See attachments) I want this, but not solely restricted to the footer.

Thanks already!

Thanks a lot! Added a custom function, so I can use it the same as the has-hover-image! I had one other question, even tho it's a bit off-topic. How do I fix using has-mask-fill at the bottom of a page? It for some reason never fills up completely. Is there anywhere where I could add an offset or something around those lines?

Yeah, sure! Here is an example of what I mean on the home page:



I'm using the following for the page build:


BjornV: Text Section is a custom-made block, don't worry about it. I added the class="has-mask-fill" to the individual text sections, so it fills in from left to right when scrolling down. But when you reach the bottom of a page, there is not enough space to fill in the text completely. This is probably because the text doesn't reach the center of the screen.

I've seen the code that handles this in the core/js/common.js

now the simple solution is to change (what I did for now) the normal

end: () => `+=${hMaskFill.offsetHeight * 1.5}` to something like end: () => `+=${hMaskFill.offsetHeight * 1.8}` adding a little offset, but this also makes every single one have an offset what just seems off when visiting the site. Especially when dealing with other resolutions.

So I was wondering if there is any way (that is already implemented) that adds a small bottom/footer offset too these effects?

Seem to have found it out myself! Added some really simple lines to the common.js, I honestly have noo idea why I didn't think of this sooner. Thanks for your time anyways!

For those who want to know how I did it:

I added startOffset and endOffset. These can easily be edited in the HTML by adding the 2 data tags: data-start-offset="1.5" & data-end-offset="85".

I added these settings to my custom block like this: