Modal Dialog without jQuery

Question

I need to create a modal dialog on a webpage using javascript. Normally this would be easy as I could use something like jQueryUI or BlockUI, but the caveat here is that I\

Answer 1

ModaliseJS, lighter than tomloprodModal and compatible with any CSS.

HTML : (omit modalise.css if you have your own design or using bootstrap)

    
    
    
    


    
Example modal 1
Show the modal
    

        

            
                

                    X
                    
Example modal
                
                

                    
Content modal
                
                

                    Do
                    thingCancel the thing
                
            
        
    

Code :

var myModal = {}

window.onload = function(){
  // It is one of the button Modalise will attach the Show event.
  // Note that you can use Modalise without the events, by omitting the .attach() function.
  // Then, you can use show() or hide() to use it manually without overload. 
  var btnOpen = document.getElementById('openModal');

  // Modalise(id, options);
  myModal = new Modalise('exampleModal', {
      btnsOpen : [btnOpen]
    })
    .attach()
    .on('onShow', console.log)
    .on('onConfirm', console.log)
    .on('onHide', console.log);
}