Video wird geladen...
Video konnte nicht geladen werden
The movement and the header. 🙌
23,010 Aufrufe • vor 1 Jahr •via X (Twitter)
6 Kommentare
Peter Elswoodvor 1 Jahr
That touch from Naylor too - probably his best ever game for us
Alastair Taylor 🧢vor 1 Jahr
Walking along, singing a song, walking in a Stewart Wonderland!! 💙⚽️💙
Oliver Gardinervor 1 Jahr
Probably my favourite ever #itfc goal, sums Marcus Stewart up perfectly
robert wilsonvor 1 Jahr
What a day what a game many great memories
Tomvor 1 Jahr
Venus had a wand of a Left foot. Tremendous and underrated player
@LowieBluevor 1 Jahr
Sublime. Still give goose bumps.
![CSS Tip 🤙 You can create this header effect using position: sticky, clip-path, and custom properties 🔥 (Video 👀) header { position: sticky; top: var(--margin); } main { clip-path: inset(var(--header) 0 0 0);) } No mix-blend-mode or animations required ✨ What's the trick then? 🧐 Duplicate the header element first. Then fix the positioning of one behind the content. header[aria-hidden] { position: fixed; top: 0; margin-top: var(--margin); } Clip the top of the content to reveal the fixed header and put a sticky-positioned header inside it that matches up in position and size ✂️ :root { --header: calc(var(--margin) + var(--font-size)); } main { clip-path: inset(var(--header) 0 0 0); } header { position: sticky; top: var(--margin); } Make your life easier with custom properties 🙌 As the body scrolls, the fixed header gets covered by the clipped content and creates the effect ✨ And because the sticky header is "stuck" it reveals itself as the content goes out of view 😍 This one's pretty cool. You can set the font color to whatever you want. At first glance, it looked like it was a mix-blend-mode thing. It doesn't have to be! Think about it and lean into z-indexing 🫶 Watch the video to get an idea of things with the exploding view 🤯 Any questions, etc. let me know! Will likely do a YouTube video on this one too! 🙏 CodePen.IO link below! 👇](https://image.24vids.com/tw-1742391976517927321/ext_tw_video_thumb/1742387238879514624/pu/img/qhFKDDbPrYvBH8B6.jpg)
