Vanilla JS Popup is a simple library that allows you to create great popups for importing just one JavaScript file. Creativa is a light-weight, easy-to-use, customizable, responsive popup field written in native (Vanilla) JavaScript.
More Features:
- Custom title, textual content, icon, and picture.
- Allows a number of popups.
- Open/close animations.
- Custom place & dimension.
- AJAX content material is supported as effectively.
- Click outdoors to dismiss.
How to make use of it:
1. Download and embody the Creativa Popup’s JavaScript on the web page.
<script src="creativa-popup.js"></script>
2. Create a fundamental popup field.
popup('Popup Title', 'Popup Message');3. Add an icon to the popup field.
popup('Popup Title', 'Popup Message', 'info');
popup('Popup Title', 'Popup Message', 'success');
popup('Popup Title', 'Popup Message', 'error');
// or a customized image
popup('Popup Title', 'Popup Message', 'danger.png');4. Add a header picture to the popup field.
popup('Popup Title', 'Popup Message', 'info', 'image.jpg');5. Insert HTML content material to the popup field.
popup('Popup Title', 'Popup Message', 'info', 'image.jpg',
content: '<p>Any Content Here</p>'
);6. Load content material from one other web page.
popup('Popup Title', 'Popup Message', 'info', 'image.jpg',);7. Customize the dimensions of the popup field.
popup('Popup Title', 'Popup Message', 'info', 'image.jpg',);8. Determine the place of the popup field.
popup('Popup Title', 'Popup Message', 'info', 'image.jpg',);
popup('Popup Title', 'Popup Message', 'info', 'image.jpg',);
popup('Popup Title', 'Popup Message', 'info', 'image.jpg',);
popup('Popup Title', 'Popup Message', 'info', 'image.jpg',);
popup('Popup Title', 'Popup Message', 'info', 'image.jpg',
position: '30%'
);9. Determine the present/conceal animations:
popup('Popup Title', 'Popup Message', 'info', 'image.jpg',
openAnimation: 'card-left',
closeAnimation: 'card-right'
);10. Create a STICKY popup field that may not be closed.
popup('Popup Title', 'Popup Message', 'info', 'image.jpg',{
isBlocked: true
});11. Customize the colors.
popup('Popup Title', 'Popup Message', 'info', 'image.jpg',{
bgColor: '#fff',
titleColor: '#404040',
textColor:'#606060'
});12. Customize the border-radius.
popup('Popup Title', 'Popup Message', 'info', 'image.jpg',{
borderRadius: '3px'
});13. Display a countdown timer.
popup('Popup Title', 'Popup Message', 'info', 'image.jpg',{
timer: true
});14. Enable/disable background.
popup('Popup Title', 'Popup Message', 'info', 'image.jpg',{
noBackground: true
});15. Customize the animation speed in ms.
popup('Popup Title', 'Popup Message', 'info', 'image.jpg',{
animationSpeed: 600
});Most Popular Plugins, Javascript Popup Window onClick, Simple Clean Popup Box In Vanilla JavaScript
See Demo And Download
Official Website(molloeduardo): Click Here
This superior jQuery/javascript plugin is developed by molloeduardo. For extra Advanced Usages, please go to the official website.