Skip to main content
Commonmark migration
Source Link

tl;dr

###tl;dr YouYou can use any selector to initiate a transition, but you don't really need one for it. All you need is to:

###initial answer

initial answer

###tl;dr You can use any selector to initiate a transition, but you don't really need one for it. All you need is to:

###initial answer

tl;dr

You can use any selector to initiate a transition, but you don't really need one for it. All you need is to:

initial answer

added 76 characters in body
Source Link
tao
  • 87.7k
  • 16
  • 125
  • 163

So, in effect, the answer to your question is: transitions work with any selector but they also work without one. They work based on DOM element property values, regardless of any selector.

So, in effect, the answer to your question is: transitions work with any selector but they also work without one.

So, in effect, the answer to your question is: transitions work with any selector but they also work without one. They work based on DOM element property values, regardless of any selector.

added 2 characters in body
Source Link
tao
  • 87.7k
  • 16
  • 125
  • 163

For example is there a way to start transitions without interaction from the user?For example is there a way to start transitions without interaction from the user?

Of course there is.! A very basic example is to add a class on <body> when all page resources have finished loading. This means that when
When <body> element is created it doesn't have the class. When and when all resources have finished loading, the Window's onload event triggers and you. We can use this event to add athe class (i.e.: .loaded) to <body> element, at which point, if If a transition is properly defined on body and the transitioned property changes because of a stronger rule defined under .loaded selector now applies on the element, the transition will happen. Without any user interaction.

For example is there a way to start transitions without interaction from the user?

Of course there is. A very basic example is to add a class on <body> when all page resources have finished loading. This means that when <body> element is created it doesn't have the class. When all resources have finished loading, the Window's onload event triggers and you can use this event to add a class (i.e.: .loaded) to <body> element, at which point, if a transition is properly defined on body and the transitioned property changes because of a stronger rule defined under .loaded selector, the transition will happen. Without any user interaction.

For example is there a way to start transitions without interaction from the user?

Of course there is! A very basic example is to add a class on <body> when all page resources have finished loading.
When <body> element is created it doesn't have the class and when all resources have finished loading, the Window's onload event triggers. We can use this event to add the class. If a transition is properly defined on body and the transitioned property changes because a stronger selector now applies on the element, the transition will happen. Without any user interaction.

added 2 characters in body
Source Link
tao
  • 87.7k
  • 16
  • 125
  • 163
Loading
added 252 characters in body
Source Link
tao
  • 87.7k
  • 16
  • 125
  • 163
Loading
added 8 characters in body
Source Link
tao
  • 87.7k
  • 16
  • 125
  • 163
Loading
deleted 59 characters in body
Source Link
tao
  • 87.7k
  • 16
  • 125
  • 163
Loading
added 584 characters in body
Source Link
tao
  • 87.7k
  • 16
  • 125
  • 163
Loading
added 528 characters in body
Source Link
tao
  • 87.7k
  • 16
  • 125
  • 163
Loading
added 308 characters in body
Source Link
tao
  • 87.7k
  • 16
  • 125
  • 163
Loading
added 308 characters in body
Source Link
tao
  • 87.7k
  • 16
  • 125
  • 163
Loading
Source Link
tao
  • 87.7k
  • 16
  • 125
  • 163
Loading