I am facing an issue where I cannot get an animated GIF to start playing after a button click. The image displays correctly but the animation does not start. I have tried various techniques like wrapping it with a div, using SetTimeOut, etc., but none of them seem to work consistently on both laptops and mobile devices. Some methods work on laptops but not on mobile devices, like setting a timeout in JavaScript. Below is the code snippet. Can you help me figure out how to make it work on both laptops and mobile devices:
<script>
function AnimateGif()
{
$("#anim_upload").css("display", "");
}
</script>
<asp:ImageButton CssClass="uploadedFile_btn" runat="server" ImageUrl="icon-upload2.png" ID="uploadedFile" OnClick="Button1_Click1" OnClientClick="AnimateGif();"/></div>
<img alt="" src="anim_upload.gif" id="anim_upload" style="display:none" />
LAPTOP solution
The following code works fine on laptops, but unfortunately, it doesn't work well on most mobile devices. I am curious about the reason behind this inconsistency.
<script>
function AnimateGif()
{
setTimeout('document.getElementById("anim_upload").style.display = "block"', 200);
}
</script>