<amp-animation id="snackbarSlideIn" layout="nodisplay">
  <script type="application/json">
    {
      "duration": "500",
      "fill": "both",
      "easing": "ease-out",
      "iterations": "1",
      "selector": ".snackbar",
      "keyframes": [{
          "transform": "translateY(-100%)"
        },
        {
          "transform": "translateY(0)"
        }
      ],
      "animation": "snackbarSlideOut"
    }
  </script>
</amp-animation>
<amp-animation id="snackbarSlideOut" layout="nodisplay">
  <script type="application/json">
    {
      "delay": "3s",
      "duration": "500",
      "fill": "both",
      "easing": "ease-in",
      "iterations": "1",
      "selector": ".snackbar",
      "keyframes": [{
          "transform": "translateY(0)"
        },
        {
          "transform": "translateY(-100%)"
        }
      ]
    }
  </script>
</amp-animation>
<div class="snackbar">
  Success
</div>

<form on="submit-success:snackbarSlideIn.start" ...>...</form>