🔔 Alert..!! Get 2 Month Free Cloud Hosting With $200 Bonus From Digital Ocean ACTIVATE DEAL

shutterModal is a simple yet highly configurable jQuery modal plugin that shows a sliding modal window with a fullscreen overlay on your web application.

Modal

Documentation

shutterModal

Simple jQuery modal plugin which slides in from top. demo : http://demos.mtsandeep.com/shutter-modal/

##Basic usage

// basic trigger for the shutterModal $('#modal-content').shutterModal(); 

##With all available options

// These are the default values $('#modal-content').shutterModal({ 	background: 'rgba(0,0,0,0.8)', // background color for the cover 	zIndex:99, // z-index value if you need any higher value 	url: '', // url to fetch content, if you want to load content from another url via ajax 	easing: 'swing', // you can use easing plugin to add other easing effects for the shutter animation 	duration: 1000, // animation duration of shutter from top 	showAfter: 0, // delay for shutter to trigger, useful when you need shutter automatically triggered after x seconds 	hideAfter: 0, // close the shutter automatically after x seconds 	close: true, // If you need a close button added automatically 	escClose: true, // do you want to close shutter with escape key 	remove: false, // remove the shutter 	onLoad : function(){}, // function called after completely loading the shutter 	onClose : function(){} // function called after completely removing the shutter }); 

##example

Include jquery, shutterModal.js into your html page and trigger the shutterModal

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>  <script src="js/shutterModal.js"></script>  <script> 	$(function(){ 		$('.show-shutter').on('click', function(e){ 			e.preventDefault(); 			$('#modal-content').shutterModal({easing:'jswing'}); 		}) 	}); </script>   <a class="show-shutter" href="#">show shutter</a>   <!-- content in hidden div --> <div id="modal-content" style="display:none"> 	<p>Hello this is a demo text</p> </div> 

You May Also Like