How to display a gif or mp4

Anvil Q&A
#1

Hi,

I have a gif and an mp4 file on my desktop. How do I display the specific gif and mp4 on my web page
because when I drag and drop the gif in the image component its turns into a static image and when I can drag and drop the mp4 file into the image component.

Please help me out. I am a beginner so if you could kindly show me the code if required it would be great.

Thank You.
Regards,
Aditya Bihani.

#2

If you set the Image component’s source property to point to your gif it will work. You do have to make sure that the path to the file ends in .gif.

Try taking a new app, adding an image component, and setting its source property to this:

https://i.imgur.com/gPb2phg.gif

You should see:

2 Likes
#3

im sorry this question may sound stupid, but

how do you get the https version of a gif ??

#4

You would have to upload it somewhere (this will make it available on the Web, just to be clear). For example, if you upload it to Giphy, you can then copy the image’s address (right click “copy image address” would work). If you don’t want to upload it to the web, but would rather use a local file, just upload it to your app with the Image component’s upload button.

#5

thank you so much

worked perfectlly fine

2 Likes