Video yükleniyor...

Video Yüklenemedi

Ana Sayfaya Dön

View Transition Types are newly baseline! These make it easier to build transitions that are specific to particular situations. Also, we have some new View Transition DevTools in Firefox 147…

FirefoxWebDevs's profile picture

Firefox for Web Developers

90,111 subscribers

15,580 görüntüleme • 7 ay önce •via X (Twitter)

LIVE

Anya Rossi• Live Now

Private livecam show

0 Yorum

Yorum bulunmuyor

Orijinal gönderinin yorumları burada görünecek

Benzer Videolar

Last week I posted about a secret config in Firefox that made view transitions easier to debug. SP said we should make it less secret. So we did.
1:09

Last week I posted about a secret config in Firefox that made view transitions easier to debug. SP said we should make it less secret. So we did.

Jake Archibald

11,430 görüntüleme • 10 ay önce

View Transitions are a gift 🎁 One set of CSS keyframes and a scoped custom property to ::view-transition-old/new(body) 🚀
0:20

View Transitions are a gift 🎁 One set of CSS keyframes and a scoped custom property to ::view-transition-old/new(body) 🚀

jhey ʕ•ᴥ•ʔ

142,262 görüntüleme • 2 yıl önce

Future CSS && UI Tip! ⚡️ You could use View Transitions to create those word carousel-type effects 😍 span:nth-of-type(2) { view-transition-name: swap; } ::view-transition-old(swap) { animation-name: slide-down; } ::view-transition-new(swap) { animation-name: slide-up; } How To 1. Create a paragraph split into spans 2. Set an interval in JavaScript that swaps out the accent word 3. Set a view-transition-name on the accent word and the last span Then you've got a responsive word carousel with View Transitions 🤙 Words and inspiration from work louder®'s home page. Had to see if this API could do it and it ended up raising a bug for the web platform! 💪 CodePen.IO link below! 👇
0:38

Future CSS && UI Tip! ⚡️ You could use View Transitions to create those word carousel-type effects 😍 span:nth-of-type(2) { view-transition-name: swap; } ::view-transition-old(swap) { animation-name: slide-down; } ::view-transition-new(swap) { animation-name: slide-up; } How To 1. Create a paragraph split into spans 2. Set an interval in JavaScript that swaps out the accent word 3. Set a view-transition-name on the accent word and the last span Then you've got a responsive word carousel with View Transitions 🤙 Words and inspiration from work louder®'s home page. Had to see if this API could do it and it ended up raising a bug for the web platform! 💪 CodePen.IO link below! 👇

jhey ʕ•ᴥ•ʔ

230,157 görüntüleme • 3 yıl önce

In addition to SubviewCollection, we also have a new Zoom Navigation Transition in iOS 18. By combining these two, we can create an Image Viewer similar to the one found on the X app. (Also, these are AsyncImages), For more👇
0:32

In addition to SubviewCollection, we also have a new Zoom Navigation Transition in iOS 18. By combining these two, we can create an Image Viewer similar to the one found on the X app. (Also, these are AsyncImages), For more👇

Kavsoft

25,292 görüntüleme • 1 yıl önce

Can you believe these slides are full page loads to completely new HTML pages‽ #smashingconf ^ try it with Canary and enable the flag chrome://flags/#view-transition-on-navigation what. rad. tech. 🤯
0:29

Can you believe these slides are full page loads to completely new HTML pages‽ #smashingconf ^ try it with Canary and enable the flag chrome://flags/#view-transition-on-navigation what. rad. tech. 🤯

Adam Argyle

456,950 görüntüleme • 3 yıl önce

“Let’s get one thing clear: no one transitions from male to female. No transition actually occurs. These boys who are competing in girls sport are boys.”
2:12

“Let’s get one thing clear: no one transitions from male to female. No transition actually occurs. These boys who are competing in girls sport are boys.”

Sall Grover

142,611 görüntüleme • 1 yıl önce

Some updates to make your life easier: - Adjust the number of moves that appear per page - Compact view for easy accessibility - Scroll position saves for better page navigation Also, you can now view the number of upvotes, downvotes, and comments on specific moves
0:33

Some updates to make your life easier: - Adjust the number of moves that appear per page - Compact view for easy accessibility - Scroll position saves for better page navigation Also, you can now view the number of upvotes, downvotes, and comments on specific moves

Okizeme.gg

22,061 görüntüleme • 1 yıl önce

✅ Baseline now has full feature coverage, making it easier to know which web platform features are ready to use. Build the next wave of Baseline-powered tools and compete for $10,000 in prizes →
1:07

✅ Baseline now has full feature coverage, making it easier to know which web platform features are ready to use. Build the next wave of Baseline-powered tools and compete for $10,000 in prizes →

Google for Developers

11,791 görüntüleme • 11 ay önce

WATCH! New Jersey just blew up its last coal fired power planet. It will build storage for renewable energy instead. These are the transitions we need to see in 2023: We have the solutions. Implement them. #ActOnClimate #climate #energy #renewables
0:22

WATCH! New Jersey just blew up its last coal fired power planet. It will build storage for renewable energy instead. These are the transitions we need to see in 2023: We have the solutions. Implement them. #ActOnClimate #climate #energy #renewables

Mike Hudema

118,205 görüntüleme • 3 yıl önce

We just shipped some nice quality of life upgrades to the Google AI Studio usage dashboards, making it easier to see the API success rate on your requests, view Gemini embedding model usage, the ability to zoom in on specific days, and a new graph design!
0:29

We just shipped some nice quality of life upgrades to the Google AI Studio usage dashboards, making it easier to see the API success rate on your requests, view Gemini embedding model usage, the ability to zoom in on specific days, and a new graph design!

Logan Kilpatrick

61,549 görüntüleme • 7 ay önce

🔌 Today we've announced measures that will make it easier and cheaper to install electric vehicle chargepoints. With plans to install over 11,000 ultra rapid chargers between now and 2030, InstaVolt are working to help more drivers make the transition to electric 👇
1:38

🔌 Today we've announced measures that will make it easier and cheaper to install electric vehicle chargepoints. With plans to install over 11,000 ultra rapid chargers between now and 2030, InstaVolt are working to help more drivers make the transition to electric 👇

Department for Transport

19,932 görüntüleme • 1 yıl önce

This week, we introduced new AI updates to @GooglePhotos that make it even easier to edit, create and search. Here are four new features to try.
0:57

This week, we introduced new AI updates to @GooglePhotos that make it even easier to edit, create and search. Here are four new features to try.

Google

196,966 görüntüleme • 9 ay önce

Sen. Tuberville: "We have entire men's teams across this country now that are turning trans. Women's teams that are turning trans...The woke globalists are pushing these kids to say if you can't compete in men's sports, let's transition and say you're a woman."
1:06

Sen. Tuberville: "We have entire men's teams across this country now that are turning trans. Women's teams that are turning trans...The woke globalists are pushing these kids to say if you can't compete in men's sports, let's transition and say you're a woman."

The Bulwark

149,145 görüntüleme • 1 yıl önce

.Stephen Miller: "It is my view and the view of this administration that [sanctuary] cities are engaged in systemic criminal violations... the word scandal doesn't even come close to describing the enormity of the evil that we are talking about with these policies."
4:17

.Stephen Miller: "It is my view and the view of this administration that [sanctuary] cities are engaged in systemic criminal violations... the word scandal doesn't even come close to describing the enormity of the evil that we are talking about with these policies."

Rapid Response 47

173,032 görüntüleme • 1 yıl önce

Trudeau: "Freedom of expression, freedom of people to share their points of view is extraordinarily important ... But we need to make sure that people are debating and discussing and basing their world view on things that are anchored in truth and reality."
2:14

Trudeau: "Freedom of expression, freedom of people to share their points of view is extraordinarily important ... But we need to make sure that people are debating and discussing and basing their world view on things that are anchored in truth and reality."

The Post Millennial

100,418 görüntüleme • 2 yıl önce