<div class="transitions">
  <button type="button" class="button alert">Click Me</button>
  <img id="boom" data-animation="scale-in-up" class="slow ease" src="http://svgshare.com/i/J8.svg" alt="Boom">
</div>
* {
  background-color: #000;
}

.transitions {
  text-align: center;
  width: 100%;
  height: 100%;
}

.button {
  margin: 20px 0 60px;
}

#boom {
  display: block;
  width: 60%;
  max-width: 960px;
  margin: 0 auto;
}
$(function() {
  $(".button").click(function() {

    var $animation = $("#boom").data("animation");

    MotionUI.animateIn($("#boom"), $animation);

  });
});

External CSS

  1. https://cdn.jsdelivr.net/foundation/6.1.1/foundation.min.css
  2. https://cdnjs.cloudflare.com/ajax/libs/motion-ui/1.2.1/motion-ui.min.css

External JavaScript

  1. //cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js
  2. //cdnjs.cloudflare.com/ajax/libs/motion-ui/1.2.1/motion-ui.min.js