Az oldal korlátolt funkcionalitással fog rendelkezni, amíg elvégezzük a felhasználói élményt javító karbantartást. Ha egy leírás nem oldja meg a problémáját, és kérdést tenne fel, akkor a támogatási közösségünk a @FirefoxSupport Twitter oldalon tud segíteni, vagy az /r/firefox oldalon a Redditen.

Avatar for Username

Támogatás keresése

Kerülje el a támogatási csalásokat. Sosem kérjük arra, hogy hívjon fel egy telefonszámot vagy osszon meg személyes információkat. Jelentse a gyanús tevékenységeket a „Visszaélés bejelentése” lehetőséggel.

További tudnivalók

A témacsoportot lezárták és archiválták. Tegyen fel új kérdést, ha segítségre van szüksége.

I have a problem with my loading icon[png] in video tag.

  • 1 válasz
  • 1 embernek van ilyen problémája
  • 9 megtekintés
  • Utolsó üzenet ettől: guigs

Kchaan
Kchaan
more options

I have a keyframes animation on loading icon in video tag, with chrome is no problem but mozilla... The problem is that animation is played mutliple times and image is blinking. in css i have prefix -webkit- , -moz-, -ms- and none. I also tryed delete -moz- and a lot of other things, but it is still doing. The image was still being blinked even i delete all keyframes animations and nothing could do that (i didn't believe my eyes) but in chrome image was stopped only in mozilla it was still blinking and playing multiple times. here is some code(currently it is without -moz- prefix): .loading{ 

 position:absolute;

top:50%; left:50%; width:64px; height:64px; 

 margin-top: -32px;
 margin-left: -32px;

background:url(loading.png) no-repeat 50% 50%; z-index:2; display:none; 

 -webkit-animation: loading 1s infinite linear;
 -ms-animation: loading 1s infinite linear;
 animation: loading 1s infinite linear;
 }

@-webkit-keyframes loading { 

0%{-webkit-transform:rotate(0deg)}
100%{-webkit-transform:rotate(360deg)}

} @-ms-keyframes loading { 

0%{-ms-transform:rotate(0deg)}
100%{-ms-transform:rotate(360deg)}

} @keyframes loading { 

0%{transform:rotate(0deg)}
100%{transform:rotate(360deg)}

} Sorry for my english (i am from Slovakia) and thanks for solutions. (i have also tryed firefox in other notebook...)

I have a keyframes animation on loading icon in video tag, with chrome is no problem but mozilla... The problem is that animation is played mutliple times and image is blinking. in css i have prefix -webkit- , -moz-, -ms- and none. I also tryed delete -moz- and a lot of other things, but it is still doing. The image was still being blinked even i delete all keyframes animations and nothing could do that (i didn't believe my eyes) but in chrome image was stopped only in mozilla it was still blinking and playing multiple times. here is some code(currently it is without -moz- prefix): .loading{ position:absolute; top:50%; left:50%; width:64px; height:64px; margin-top: -32px; margin-left: -32px; background:url(loading.png) no-repeat 50% 50%; z-index:2; display:none; -webkit-animation: loading 1s infinite linear; -ms-animation: loading 1s infinite linear; animation: loading 1s infinite linear; } @-webkit-keyframes loading { 0%{-webkit-transform:rotate(0deg)} 100%{-webkit-transform:rotate(360deg)} } @-ms-keyframes loading { 0%{-ms-transform:rotate(0deg)} 100%{-ms-transform:rotate(360deg)} } @keyframes loading { 0%{transform:rotate(0deg)} 100%{transform:rotate(360deg)} } Sorry for my english (i am from Slovakia) and thanks for solutions. (i have also tryed firefox in other notebook...)

Összes válasz (1)

guigs
guigs
more options

Most of this information can be found in detail in Mozilla's MDN wiki:

If we cannot find a basic solution here, asking in stackoverflow.com and tagging it Firefox will get the attention of the dedicated Firefox developer's support.

In the meantime the test on this documented page is linked here:


Two things I learned from this:

  • @keyframes do not work if the css is inline
  • hidden overflow will help some issues with multiple screensizes

I did notice a little lag, but I do have a slow internet connection at the moment.

I did stumble upon this trick that mentions that sometimes there is flickering with the hidden element: https://css-tricks.com/almanac/proper.../backface-visibility/