Share a simple jquery litebox mask layer plug-in written by myself, directly add class liteBox call, there is a loading progress bar, set the width, height and whether there is a scroll bar in the link! Js compression code 1.4 k
<! DOCTYPE html PUBLIC "-// W3C // dtd xhtml 1.0 Transitional // EN "" http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd "> <Html xmlns =" http://www.w3.org/1999/xhtml "> <Head> <meta http-equiv =" Content-Type "content =" text/html; charset = gb2312 "/> <title> demo </title> <style> body {width: 100%; height: 100% ;}* {margin: 0; padding: 0 ;} # lite-overlay {position: fixed; width: 100%; height: 100%; top: 0; left: 0; background-color: #000; filter: alpha (opacity = 75);-moz-opacity: 0.75; opacity: 0.75;} * html # lite-overlay {position: absolute ;}. liteTitle {height: 30px; line-height: 30px; text-indent: 12px; font-size: 12px; font-weight: bold; background: # F5F8FA; position: relative ;}. liteClose {height: 30px; line-height: 30px; cursor: pointer; position: absolute; right: 15px; top: 0; font-size: 12px ;} # lite-content {background: # fff; position: fixed; top: 50%; left: 50%; z-index: 100; display: none ;} * html # lite-content {position: absolute;}/* -- loading -- */# liteloading {position: absolute; width: 208px; height: 13px; left: 50%; top: 50%; margin-left:-pixel PX; margin-top:-6px; z-index: 10000; background: url (/uploads/Common/images/loadingAnimation.gif) no-repeat ;} </style> <script src =" http://www.bkjia.com/ Uploads/Common/jquery-1.3.2.min.js "type =" text/javascript "> </script> <script src =" http://www.bkjia.com/ Uploads/Common/litebox. jquery-min.js "type =" text/javascript "> </script>
Tip: the code can be modified before running!