Czy ktoś wie, jak obejść się, aby animowane pliki GIF były nadal animowane po kliknięciu łącza lub przesłaniu formularza na stronie, na której się znajdujesz w IE? Działa to dobrze w innych przeglądarkach.
Dzięki.
Czy ktoś wie, jak obejść się, aby animowane pliki GIF były nadal animowane po kliknięciu łącza lub przesłaniu formularza na stronie, na której się znajdujesz w IE? Działa to dobrze w innych przeglądarkach.
Dzięki.
Odpowiedzi:
Przyjęte rozwiązanie nie zadziałało dla mnie.
Po kilku dalszych badaniach natknąłem się na to obejście i faktycznie działa.
Oto sedno tego:
aw Twoim html:
Więc kiedy formularz jest przesyłany,
<img/>
tag jest wstawiany iz jakiegoś powodu nie ma na to wpływu np. Problemy z animacją.Przetestowano w Firefoksie, ie6, ie7 i ie8.
źródło
code
<div id = "img_content"> <img id = 'aj_loader' src = 'asset / 2631.gif' style = "display: none;" /> </div> A potem:code
$ ("# img_content"). html ($ ("# img_content"). html ());stare pytanie, ale publikuję je dla innych pracowników Google:
Spin.js DZIAŁA w tym przypadku użycia: http://fgnass.github.com/spin.js/
źródło
IE zakłada, że kliknięcie linku zwiastuje nową nawigację, w której zostanie zastąpiona obecna zawartość strony. W ramach tego procesu zatrzymuje kod, który animuje GIF-y. Wątpię, czy jest coś, co możesz z tym zrobić (chyba że faktycznie nie nawigujesz, w takim przypadku użyj funkcji return false w zdarzeniu onclick).
źródło
Oto jsFiddle, który działa dobrze podczas przesyłania formularza z method = "post". Spinner jest dodawany podczas przesyłania formularza.
Zobacz kod jsFiddle tutaj
Przetestuj w swojej przeglądarce IE tutaj
źródło
Natknąłem się na ten post i chociaż już otrzymałem odpowiedź, czułem, że powinienem opublikować informacje, które pomogły mi w rozwiązaniu tego problemu specyficznego dla IE 10 i mogą pomóc innym, którzy dotarli do tego posta z podobnym problemem.
Byłem zaskoczony tym, że animowane gify po prostu nie wyświetlały się w IE 10, a potem znalazłem ten klejnot.
Tools→ Internet Options→ Advanced→ MultiMedia→Play animations in webpages
mam nadzieję że to pomoże.
źródło
beforeunload
lubunload
zdarzeniu.Napotkałem ten problem, gdy próbowałem wyświetlić ładujący się gif podczas przetwarzania przesłania formularza. Dodatkową frajdą było to, że to samo przesłanie wymagało uruchomienia walidatora, aby upewnić się, że formularz jest poprawny. Jak wszyscy inni (na każdym poście formularza IE / gif w Internecie) nie mogłem zmusić spinnera ładowania do "zakręcenia" w IE (i, w moim przypadku, zweryfikowania / przesłania formularza). Przeglądając porady na http://www.west-wind.com znalazłem post przez ev13wt, który sugerował, że problem to „... że IE nie renderuje obrazu jako animowanego, ponieważ był niewidoczny podczas renderowania. " To miało sens. Jego rozwiązanie:
Pozostaw puste miejsce, w którym miałby się znaleźć gif i użyj JavaScript, aby ustawić źródło w funkcji onsubmit - document.getElementById ('loadingGif'). Src = "ścieżka do pliku gif".
Oto jak to zaimplementowałem:
To działało dobrze we wszystkich przeglądarkach!
źródło
Oto co zrobiłem. Wszystko, co musisz zrobić, to podzielić GIF, aby powiedzieć 10 obrazów (w tym przypadku zacząłem
01.gif
i skończyłem na10.gif
) i określić katalog, w którym je przechowujesz.HTML:
JavaScript:
Ta metoda działa z IE7, IE8 i IE9 (chociaż dla IE9 można by użyć
spin.js
). UWAGA: Nie testowałem tego w IE6, ponieważ nie mam maszyny z przeglądarką z lat 60., chociaż metoda jest tak prosta, że prawdopodobnie działa nawet w IE6 i niższych.źródło
W związku z tym musiałem znaleźć poprawkę, w której animowane gify były używane jako obraz tła, aby zapewnić, że stylizacja zostanie zachowana w arkuszu stylów. Tam też u mnie zadziałała podobna poprawka ... mój skrypt poszedł mniej więcej tak (używam jQuery, żeby ułatwić sobie wyliczony styl tła - jak to zrobić bez jQuery to temat na inny post):
[EDYTUJ] Po nieco dalszych testach właśnie zdałem sobie sprawę, że to nie działa z obrazami tła w IE8. Próbowałem wszystkiego, co przychodziło mi do głowy, aby IE8 renderował animację gif podczas ładowania strony, ale w tej chwili nie wygląda to na możliwe.
źródło
$(spinner).css('background-image')
), ale zamiast ustawiać go w ten sam sposób, używasz czystego sposobu JavaScript (spinner.style.backgroundImage
). Twój kod nie działa dla mnie w żadnej przeglądarce. Jeśli używam bezpośrednio Twojego kodu, pojawia sięcannot set backgroundImage property of undefined
błąd. Jeśli zmienię twój kod, aby ustawić CSS za pomocą jQuery, kod działa bez żadnych błędów, ale obraz nie jest resetowany, a element div / spinner pozostaje pusty. Nie wiem dlaczegobackground-image
właściwości wwydarzeniachunload
lubbeforeunload
. Zobacz to pytanie lub ten jsFiddle, aby uzyskać szczegółowe informacje.Opierając się na odpowiedzi @danfolkes, działało to dla mnie w IE 8 i ASP.NET MVC3.
W naszym _Layout.cshtml
<<< treść tutaj >>> ...
A w naszych linkach nawigacyjnych:
lub
źródło
Znalazłem to rozwiązanie na http://timexwebdev.blogspot.com/2009/11/html-postback-freezes-animated-gifs.html i DZIAŁA! Po prostu ponownie załaduj obraz przed ustawieniem go jako widoczny. Wywołaj następującą funkcję Javascript z przycisku onclick:
źródło
Zdaję sobie sprawę, że to stare pytanie i że do tej pory każdy z oryginalnych plakatów znalazł rozwiązanie, które działa dla nich, ale natknąłem się na ten problem i stwierdziłem, że tagi VML nie padają ofiarą tego błędu IE. Animowane GIF-y nadal poruszają się podczas wyładowywania strony po umieszczeniu w przeglądarce IE przy użyciu tagów VML.
Zauważ, że wykryłem VML przed podjęciem decyzji o użyciu znaczników VML, więc działa to w FireFox i innych przeglądarkach, które używają normalnego zachowania animowanego GIF-a.
Oto jak to rozwiązałem.
Oczywiście opiera się to na jQuery, jQueryUI i wymaga pewnego typu animowanego pliku GIF („/images/loading_gray.gif”).
źródło
JQuery:
źródło
Właśnie miałem podobny problem. Te działały idealnie dla mnie.
Innym pomysłem było użycie .load () jQuery; aby załadować, a następnie dołączyć obraz.
Działa w IE 7+
źródło
Bardzo, bardzo późno, aby odpowiedzieć na to pytanie, ale właśnie odkryłem, że użycie obrazu tła, który jest zakodowany jako identyfikator URI base64 w CSS, zamiast przechowywanego jako oddzielny obraz, nadal animuje się w IE8.
źródło
Bardzo prostym sposobem jest użycie wtyczki jQuery i SimpleModal . Następnie, gdy muszę pokazać mój „ładujący się” gif podczas przesyłania, robię:
źródło
Miałem ten sam problem, wspólny także dla innych przeglądarek, takich jak Firefox. W końcu odkryłem, że dynamiczne tworzenie elementu z animowanym gifem w formularzu nie jest animowane, więc opracowałem następujący element roboczy.
1) W
document.ready()
każdym FORMULARZU znajdującym się na stronie otrzymujemyposition:relative
własność, a następnie do każdego dołączana jest niewidocznaDIV.bg-overlay
.2) Następnie, zakładając, że każda przesłana wartość mojej witryny jest identyfikowana przez
btn-primary
klasę css, ponownie nadocument.ready()
, szukam tych przycisków, przechodzę do rodzica FORMU każdego z nich i przy wysyłaniu formularza uruchamiamshowOverlayOnFormExecution(this,true);
funkcję, mijając kliknięty przycisk i wartość logiczna, która przełącza widocznośćDIV.bg-overlay
.CSS dla
DIV.bg-overlay
jest następujący:3) Przy każdym przesłaniu formularza uruchamiana jest następująca funkcja, aby pokazać pół-białe tło na całej powierzchni (co uniemożliwia ponowne interakcję z formularzem) i animowany gif wewnątrz niego (który wizualnie pokazuje akcję ładowania).
Pokazywanie animowanego gifa przy wysyłaniu formularza, zamiast dołączania go w tym zdarzeniu, rozwiązuje problem "zamrożenia animacji gif" w różnych przeglądarkach (jak powiedziałem, znalazłem ten problem w IE i Firefox, a nie w Chrome)
źródło