Invisible button in animated GIF

Report · Mar 20, 2023

Hello,

I want to add an invisible full page button to animation and export it as an animated GIF. The problem is when I export the animated the button is not invisible. I have tried so many things, but cannot find what I am doing wrong. It seems to work when published as HTML5, so I'm wondering whether the URL click through should be added by the developer when being uploaded to the website?

Some advice would be much appreciated.

Kind regards,

Elishea

Report · Mar 20, 2023

Hi.

When you turn your animation into a GIF, you lose all interactivity that existed in the FLA.

If you want to export your animation as a GIF file then you have to add the click event to the an img tag or another tag in your page that will contain your GIF. For example:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Example</title>
</head>
<body>
    <img id="emoji" src="your_emoji.gif" alt="Emoji">
    <script>
        var emoji = document.getElementById("emoji");
        emoji.addEventListener("click", function(){ alert("You clicked on the emoji!"); });
    </script>
</body>
</html>

Is this what you want? Please let us know.

Regards,

JC

Report · Mar 21, 2023

Hi JC,

Thank you so much for your message, this answers my question perfectly.

All the best,

Elishea

Report · Mar 21, 2023

Great! You're welcome!

Report · Mar 20, 2023

the anchor tag should be added to the html that adds the gif

Invisible button in animated GIF

1 Correct answer