Cross-Document View Transitions for MPA: you need @view-transition to opt-in, not the meta tag

Time to update your MPA View Transitions experimentations!


This content originally appeared on Bram.us and was authored by Bramus!

Promotional screenshot as used on social media (tweet, toot)

~

đź“Ł PSA: Time to update your MPA View Transitions experimentations!

The opt-in for Cross-Document View Transitions for MPAs (aka: “just websites”) is by means of the @​view-transition at-rule in CSS.

@view-transition {
  navigation: auto;
}

This opt-in needs to be present on both pages participating in the View Transition.

The meta tag that you might know from before was a temporary thing while the feature was being developed behind a flag. The meta tag no longer does anything and was removed in Chrome 125, it’s the CSS opt-in that you need.

Cross-Document View Transitions are shipping to stable (read: enabled by default for all users) in Chrome 126.

If you haven’t been following, there’s also two new things that you can use with View Transitions nowadays:

1. View Transition Types
2. view-transition-class

See https://developer.chrome.com/blog/view-transitions-update-io24?hl=en for an overview (text + video) of all additions and improvements.

~

Spread the word

Feel free to repost one of the posts from social media to give them more reach, or link to this post from your own blog.

~

🔥 Like what you see? Want to stay in the loop? Here's how:


This content originally appeared on Bram.us and was authored by Bramus!


Print Share Comment Cite Upload Translate Updates
APA

Bramus! | Sciencx (2024-05-24T09:43:36+00:00) Cross-Document View Transitions for MPA: you need @view-transition to opt-in, not the meta tag. Retrieved from https://www.scien.cx/2024/05/24/cross-document-view-transitions-for-mpa-you-need-view-transition-to-opt-in-not-the-meta-tag/

MLA
" » Cross-Document View Transitions for MPA: you need @view-transition to opt-in, not the meta tag." Bramus! | Sciencx - Friday May 24, 2024, https://www.scien.cx/2024/05/24/cross-document-view-transitions-for-mpa-you-need-view-transition-to-opt-in-not-the-meta-tag/
HARVARD
Bramus! | Sciencx Friday May 24, 2024 » Cross-Document View Transitions for MPA: you need @view-transition to opt-in, not the meta tag., viewed ,<https://www.scien.cx/2024/05/24/cross-document-view-transitions-for-mpa-you-need-view-transition-to-opt-in-not-the-meta-tag/>
VANCOUVER
Bramus! | Sciencx - » Cross-Document View Transitions for MPA: you need @view-transition to opt-in, not the meta tag. [Internet]. [Accessed ]. Available from: https://www.scien.cx/2024/05/24/cross-document-view-transitions-for-mpa-you-need-view-transition-to-opt-in-not-the-meta-tag/
CHICAGO
" » Cross-Document View Transitions for MPA: you need @view-transition to opt-in, not the meta tag." Bramus! | Sciencx - Accessed . https://www.scien.cx/2024/05/24/cross-document-view-transitions-for-mpa-you-need-view-transition-to-opt-in-not-the-meta-tag/
IEEE
" » Cross-Document View Transitions for MPA: you need @view-transition to opt-in, not the meta tag." Bramus! | Sciencx [Online]. Available: https://www.scien.cx/2024/05/24/cross-document-view-transitions-for-mpa-you-need-view-transition-to-opt-in-not-the-meta-tag/. [Accessed: ]
rf:citation
» Cross-Document View Transitions for MPA: you need @view-transition to opt-in, not the meta tag | Bramus! | Sciencx | https://www.scien.cx/2024/05/24/cross-document-view-transitions-for-mpa-you-need-view-transition-to-opt-in-not-the-meta-tag/ |

Please log in to upload a file.



There are no updates yet.
Click the Upload button above to add an update.

You must be logged in to translate posts. Please log in or register.

Related Posts