2013-03-22 13 views
8

Chcę wyświetlić preloader na mojej stronie przed załadowaniem zawartości, jednak gdy wybiorę animowany obraz preloadera z przezroczystym tłem, krawędzie wyglądają na bardzo postrzępione. Jak mogę zmodyfikować obraz lub czy istnieje sposób na przezroczyste tło animowanych gifów?Animowany przezroczysty obraz preloadera na jednolitym kolorowym tle

używam obciążenia wstępnego z preloader.net

Odpowiedz

9

Pierwszy i prawdopodobnie najłatwiejsza opcja masz jest użycie spin.js. „Dynamicznie tworzy przędzenia wskaźniki aktywności, które mogą być stosowane jako zamiennik niezależne od rozdzielczości dla AJAX ładowania GIF.”


Jeśli skrypt nie jest opcją, lub chcesz mieć inny spinner ty musisz utworzyć .gif bez antyaliasingu, który jest większy niż spinner, którego chcesz użyć i skalować go za pomocą html.

oryginalny tarczy wygładzane (brzydki krawędziowy nie białym tle)

Spinner anti-aliased

oryginalny przędzarki bez krawędzi (bez wygładzania, w związku z czym ma piksele krawędzi)

Ale jeśli ten spinner pobiera skalowany w dół, to wygląda ładnie:

Należy używać

img { 
    -ms-interpolation-mode:bicubic; 
} 

aby również ładny wygląd w starszych IES.

Powiązane problemy