Загрузка видео...

Не удалось загрузить видео

На главную

Next version of Satori: grid/block/inline/inline-block, fixed/sticky, float/clear, list-style, counter, word-spacing, overflow, aspect-ratio, order, visibility, outline, mix-blend-mode, isolation, paint-order, z-index, 3D transform, conic gradient, calc(), min/max/clamp()

shuding's profile picture

Shu

63,054 subscribers

27,022 просмотров • 9 дней назад •via X (Twitter)

Наука и технологии
LIVE

Anya Rossi• Live Now

Private livecam show

Комментарии: 0

Нет доступных комментариев

Здесь появятся комментарии из оригинального поста

Похожие видео

the trick: CSS position: sticky + mix-blend-mode: difference the bonus trick: add an extra layer and chain the blend to block content out 👨‍🍳
0:24

the trick: CSS position: sticky + mix-blend-mode: difference the bonus trick: add an extra layer and chain the blend to block content out 👨‍🍳

jhey ʕ•ᴥ•ʔ

160,153 просмотров • 1 год назад

🔥 CSS Tip! Have you ever wanted the benefits of a block element but the sizing of an inline element? width: max-content; comes in super handy here 👌
1:00

🔥 CSS Tip! Have you ever wanted the benefits of a block element but the sizing of an inline element? width: max-content; comes in super handy here 👌

Wes Bos

23,424 просмотров • 2 лет назад

THE POWER OF ORDER BLOCK.
0:22

THE POWER OF ORDER BLOCK.

Cryptowave Lab

10,598 просмотров • 7 месяцев назад

ORDER BLOCK...
0:23

ORDER BLOCK...

MARKET INSIGHTS!

266,558 просмотров • 10 месяцев назад

ORDER BLOCK.
0:22

ORDER BLOCK.

MARKET INSIGHTS!

73,241 просмотров • 11 месяцев назад

Order block
0:38

Order block

MARKET INSIGHTS!

26,922 просмотров • 10 месяцев назад

The Power of Order Block!📊 #trading
0:25

The Power of Order Block!📊 #trading

Sunil Gurjar, CFTe

65,517 просмотров • 3 месяцев назад

Order Block!🎯 #trading
0:25

Order Block!🎯 #trading

Sunil Gurjar, CFTe

26,832 просмотров • 7 месяцев назад

Order Block!📊 #trading
0:25

Order Block!📊 #trading

Sunil Gurjar, CFTe

114,322 просмотров • 9 месяцев назад

Order Block!📊 #trading
0:25

Order Block!📊 #trading

Sunil Gurjar, CFTe

39,933 просмотров • 7 месяцев назад

CSS Trick 🎞️ You can create an infinite marquee/carousel animation without duplicate items 🤙 li { --destination: calc(var(--idx) * -100%); } @​keyframes slide { to { translate: var(--destination) 0;}} Animate the items, not the list 😎 Here's the next ! 👇 The main trick here is animating the items and not the list. You can lean into custom properties to work out the origin and destination of an item. Inline some custom properties on the list and the items. Then use these to calculate the origin and the destination for each item in the list ⭐️ li { --origin: calc((var(--count) - var(--index)) * 100%); --destination: calc((var(--index) + 1) * -100%); } The last piece is hooking up the animation li { --duration: calc(var(--speed) * 1s); --delay: calc( (var(--duration) / var(--count)) * var(--index, 0) ); animation: slide var(--duration) calc(var(--delay) - (var(--count) * 0.5s)) infinite linear; } The important part here is using those custom properties to define and calculate the animation properties for the items in the list 🤙 It's hard to cover everyone's use case in one demo 😅 But we try 🙏 As always, any requests, suggestions, questions, etc. Hit me up! 🤙 CodePen.IO link below 👇 p.s Can anyone recommend a decent lavalier microphone so I can record these better on the road 😭
9:49

CSS Trick 🎞️ You can create an infinite marquee/carousel animation without duplicate items 🤙 li { --destination: calc(var(--idx) * -100%); } @​keyframes slide { to { translate: var(--destination) 0;}} Animate the items, not the list 😎 Here's the next ! 👇 The main trick here is animating the items and not the list. You can lean into custom properties to work out the origin and destination of an item. Inline some custom properties on the list and the items. Then use these to calculate the origin and the destination for each item in the list ⭐️ li { --origin: calc((var(--count) - var(--index)) * 100%); --destination: calc((var(--index) + 1) * -100%); } The last piece is hooking up the animation li { --duration: calc(var(--speed) * 1s); --delay: calc( (var(--duration) / var(--count)) * var(--index, 0) ); animation: slide var(--duration) calc(var(--delay) - (var(--count) * 0.5s)) infinite linear; } The important part here is using those custom properties to define and calculate the animation properties for the items in the list 🤙 It's hard to cover everyone's use case in one demo 😅 But we try 🙏 As always, any requests, suggestions, questions, etc. Hit me up! 🤙 CodePen.IO link below 👇 p.s Can anyone recommend a decent lavalier microphone so I can record these better on the road 😭

jhey ʕ•ᴥ•ʔ

233,315 просмотров • 2 лет назад

Order Block!🎯👇 #trading
0:27

Order Block!🎯👇 #trading

Sunil Gurjar, CFTe

38,639 просмотров • 8 месяцев назад

How to spot a high probability order block. Comment "Block" & I'll DM you
0:23

How to spot a high probability order block. Comment "Block" & I'll DM you

Liquidity Sniper

13,692 просмотров • 1 год назад

image crossfade with CSS :has() 💅 img { transition: opacity 0.24s; } ul:has(li:nth-of-type(2):hover) img:nth-of-type(2) { mix-blend-mode: plus-lighter; opacity: 1; z-index: 2; } few tricks to this demo 🤙
0:25

image crossfade with CSS :has() 💅 img { transition: opacity 0.24s; } ul:has(li:nth-of-type(2):hover) img:nth-of-type(2) { mix-blend-mode: plus-lighter; opacity: 1; z-index: 2; } few tricks to this demo 🤙

jhey ʕ•ᴥ•ʔ

108,894 просмотров • 1 год назад

Press Down, Forward, Back, Block in that order
0:55

Press Down, Forward, Back, Block in that order

Best Funny Videos 😂

29,962 просмотров • 29 дней назад

Liquidity+ FVG +Order Block📊👇 #trading
0:22

Liquidity+ FVG +Order Block📊👇 #trading

Sunil Gurjar, CFTe

22,517 просмотров • 7 месяцев назад

Liquidity sweep Order block Break of structure Study and bookmark 🔖 Join Telegram;
0:21

Liquidity sweep Order block Break of structure Study and bookmark 🔖 Join Telegram;

Woman Trader

18,190 просмотров • 8 месяцев назад

A SHORT BACKTESTING VIDEO. Entry 1; order block(OB) Entry 2; breaker block(BB) Entry 3; missed trade Entry 4; order block(OB). Like and repost for others to see.. Thanks... Like and RT for others to see😍😍
1:52

A SHORT BACKTESTING VIDEO. Entry 1; order block(OB) Entry 2; breaker block(BB) Entry 3; missed trade Entry 4; order block(OB). Like and repost for others to see.. Thanks... Like and RT for others to see😍😍

Aart 📈

16,277 просмотров • 2 лет назад

Master ICT Order Block and CISD, Change In State Of Delivery in 51 seconds.
0:50

Master ICT Order Block and CISD, Change In State Of Delivery in 51 seconds.

JeRRy MMXM

10,210 просмотров • 8 месяцев назад

Not many lines for a CSS parallax effect either 🤙 ul { scroll-padding-inline: calc(50% - var(-card) * 0.5); } img { animation: para; animation-timeline: --item; } @​keyframes para { cover 100% { translate: calc(100% - var(--card)) -50%; }}
0:43

Not many lines for a CSS parallax effect either 🤙 ul { scroll-padding-inline: calc(50% - var(-card) * 0.5); } img { animation: para; animation-timeline: --item; } @​keyframes para { cover 100% { translate: calc(100% - var(--card)) -50%; }}

jhey ʕ•ᴥ•ʔ

274,984 просмотров • 2 лет назад