Cette page a été traduite à partir de l'anglais par la communauté. Vous pouvez contribuer en rejoignant la communauté francophone sur MDN Web Docs.

View in English Always switch to English

-webkit-transition

Obsolète: Cette fonctionnalité n'est plus recommandée. Même si certains navigateurs la prennent encore en charge, elle a peut-être déjà été supprimée des standards du web, est en passe d'être supprimée ou n'est conservée qu'à des fins de compatibilité. Évitez de l'utiliser et mettez à jour le code existant si possible ; consultez le tableau de compatibilité au bas de cette page pour vous aider à prendre votre décision. Sachez que cette fonctionnalité peut cesser de fonctionner à tout moment.

Non standard: Cette fonctionnalité n'est pas standardisée. Nous déconseillons d'utiliser des fonctionnalités non standard en production, car leur prise en charge par les navigateurs est limitée, et elles peuvent être modifiées ou supprimées. Toutefois, elles peuvent constituer une alternative appropriée dans certains cas où aucune option standard n'existe.

Note : Tous les navigateurs prennent en charge la propriété transition sans préfixe. Seuls les navigateurs basés sur WebKit (Safari), et non Chromium, prennent en charge la caractéristique média -webkit-transition. Aucun navigateur ne prend en charge transition sans préfixe comme requête média (certains navigateurs prennent en charge -webkit-transform-3d). Utilisez plutôt la requête de fonctionnalité @supports (transition).

La caractéristique média booléenne non standard CSS -webkit-transition est une extension WebKit qui vaut true si le contexte de navigation prend en charge les transitions CSS.

Apple propose une description dans la référence CSS de Safari (angl.) ; cette propriété s'appelle désormais transition dans la documentation Apple.

Note : Vous ne devez pas utiliser cette caractéristique média : elle n'a jamais été spécifiée, n'a jamais été largement implémentée et a été supprimée de la plupart des navigateurs. Utilisez plutôt une requête de fonctionnalité @supports.

Syntaxe

css
@media (-webkit-transition) {
  /* CSS à utiliser si cette caractéristique média et les transitions préfixées sont prises en charge */
}

Exemples

Utiliser @supports à la place

N'utilisez pas la caractéristique média -webkit-transition. Testez plutôt la prise en charge des transitions avec la règle @ de CSS @supports :

css
@supports (transition: initial) {
  /* CSS à utiliser si les transitions sont prises en charge */
}

Exemple obsolète

Avant d'être obsolète, on pouvait utiliser -webkit-transition dans le CSS comme ceci :

css
@media (-webkit-transition) {
  /* CSS à utiliser si les transitions sont prises en charge */
}

Spécifications

Ne fait partie d'aucun standard.

Compatibilité des navigateurs

Voir aussi