Skip to content

A simple & lightweight & high performance method of displaying modal window for mobile only

License

Notifications You must be signed in to change notification settings

zechau/modal-mobile

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

23 Commits
 
 
 
 
 
 
 
 

Repository files navigation

modal-mobile

A simple & lightweight & high performance method of displaying modal window for mobile only

why modal-mobile

The modal-mobile doesn't rely on any javascirt library and takes advantages of the new featues of browser like 'queryseletor' and so on. So it's really light-weight with high performance. that's amazing! Because of its light it's also easy to be customized!

Installation

<link rel="stylesheet" type="text/css" href="/path/to/modal-mobile.css">
<script src="/path/to/modal-mobile.js"></script>

Usage

add html with styles

<!--dialog html-->
<div class="modal-dialog">
			<div class="modal-header">
				<h4>Modal title</h4>
			</div>
			<div class="modal-body">one fine body...</div>
			<div class="modal-footer">
				<a>Cancel</a>
				<a data-btn="ok">OK</a>
				<i></i>
			</div>
 </div>
 
 <!--loding tip html-->
<div class="modal-loading">loading...</div>

call functions

//show dialog
modal.showDialog({
	cancelCb: function(){
	//do something after cancel clicked
	},
	okCb: function(){
	//do something after ok clicked
	}
});

//show loading
modal.showLoading();

License

MIT

About

A simple & lightweight & high performance method of displaying modal window for mobile only

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published