核心思路:设置一个隐藏的(display:none;)、背景偏暗的div及其子div作为对话框,当点击某处时,将此div设置为显示。
核心代码如下(部分js代码用于动态调整div内容的行高,这部分代码可以忽略):
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="demo.css">
<script src="jquery-1.10.1.min.js"></script>
<script>
function getHeight(className) {
var height = $(className).height();
return height;
}
function setLineHeight(className) {
var height = getHeight(className) + "px";
$(className).css("line-height",height);
}
$(function() {
//调整行高并设置回调函数,窗口一动我也动
setLineHeight(".init-page-btn");
setLineHei