Press "Enter" to skip to content

Create Modals, Sidebars, Notifications, Pop-ups With CSS Transitions

vue-over-body is a conditional creation, modals, sidebars, notifications, and windows pop-ups with CSS transitions!

vue popup window, vue transition slide down, vue js modal popup example, css transition modal, vue animation examples, vue transition v for

How to make use of it:

Install & Download:

npm install --save vue-over-body


import Vue from 'vue'
  import overBody from 'vue-over-body'

  new Vue({
    components: {
      'vue-over-body': overBody
    data: function () {
      return {
        open: 1
<vue-over-body :dim="false" :open="open" before="before" after="after" :transition="0.3">
      <button @click="open = 0">&times;</button>
      <p>A little alert message!</p> 
      <p>For the users of your app!</p> 
.before {
    top: 50px;
    right: -300px;
    width: 300px;

  .after {
    right: 50px;

vuejs popup with css transitions, vue-over-body Plugin/Github, vue transition group enter not working

See Demo And Download

Official Website(marcodpt): Click Here

This superior jQuery/javascript plugin is developed by marcodpt. For extra advanced usage, please go to the official website.

Be First to Comment

    Leave a Reply

    Your email address will not be published.