title: Keep DOM visible after transition in vue.js
body: <p>I'm trying to create a transition with a circle that will expand to fill the 100% of the width and height of the container but I can't seem to get the DOM to remain visible after the transition.</p>
  
  <p>I'm in the process of learning vue.js so I'm not sure if this is intended or not is there a way to keep the circle visible when it's expanded to the <code>scale(100)</code>? Is there a better way to achieve this?</p>
  
  <p>html:</p>
  
  <pre><code>&lt;div id="app"&gt;
    &lt;div v-show="show" :transition="zoomCircle" class="circle"&gt;&lt;/div&gt;
    &lt;button @click="show = ! show"&gt;zoom&lt;/button&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>js:</p>
  
  <pre><code>Vue.transition('zoom', {
    enterClass: 'zoomOut',
    leaveClass: 'zoomIn'
  });
  new Vue({
    el: '#app',
    data: {
      show: true,
      zoomCircle: 'zoom'
    }
  });
  </code></pre>
  
  <p>related fiddle:
  <a href="https://jsfiddle.net/joepaulgo/hkfg9vpr/" rel="nofollow">https://jsfiddle.net/joepaulgo/hkfg9vpr/</a></p>