Discussion :

[domdub8]

Bonjour,
Je bloque sur une animation qui fonctionne très bien avec Firefox et Edge mais pas du tout avec Chrome et Opera malgré les bons préfixes. J'ai fais une image sous Photoshop avec 4 photos consécutives mais ni la première photo ni l'animation ne fonctionnent avec Chrome et Opéra.
Quelqu'un peut m'aider svp?????.... Merci

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
#concert{
	animation: concert 20s infinite;
	-moz-animation: concert 20s infinite;
	-webkit-animation: concert 20s infinite;
	-o-animation: concert 20s infinite;
	-ms-animation: concert 20s infinite;
}
 
@keyframes concert{
	0% {background: 0 0;}
	25% {background: 360px 0;}
	50% {background: 720px 0;}
	75% {background: 1080px 0;}
	100% {background: 1440px 0;}
}
@-moz-keyframes concert{
	0% {background: 0 0;}
	25% {background: 360px 0;}
	50% {background: 720px 0;}
	75% {background: 1080px 0;}
	100% {background: 1440px 0;}
}
@-webkit-keyframes concert{
	0% {background: 0 0;}
	25% {background: 360px 0;}
	50% {background: 720px 0;}
	75% {background: 1080px 0;}
	100% {background: 1440px 0;}
}
@-o-keyframes concert{
	0% {background: 0 0;}
	25% {background: 360px 0;}
	50% {background: 720px 0;}
	75% {background: 1080px 0;}
	100% {background: 1440px 0;}
}

[NoSmoking]

Bonjour,
déjà je pense que tu peux virer ce qui concerne les préfixe propriétaire.

Dans ton animation précise bien que c'est la position que tu souhaites voir changer.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
@keyframes concert {
  0% {
    background-position: 0 0;
  }
  25% {
    background-position: 360px 0;
  }
  50% {
    background-position: 720px 0;
  }
  75% {
    background-position: 1080px 0;
  }
  100% {
    background-position: 1440px 0;
  }
}

[domdub8]

OK merci...