<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title> New Document </title> <meta name="Generator" content="EditPlus"> <meta name="Author" content=""> <meta name="Keywords" content=""> <meta name="Description" content=""> <script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.min.js"></script> <script> var LoginUI = !!window.LoginUI || {}; //$ = function (id) { return document.getElementById(id) } LoginUI.getViewportWidth = function () { var width = 0; if (document.documentElement && document.documentElement.clientWidth) { width = document.documentElement.clientWidth; } else if (document.body && document.body.clientWidth) { width = document.body.clientWidth; } else if (window.innerWidth) { width = window.innerWidth - 18; } return width; } LoginUI.getViewportHeight = function () { var height = 0; if (window.innerHeight) { height = window.innerHeight - 18; } else if (document.documentElement && document.documentElement.clientHeight) { height = document.documentElement.clientHeight; } else if (document.body && document.body.clientHeight) { height = document.body.clientHeight; } return height; } LoginUI.getViewportScrollY = function () { var scrollY = 0; if (document.documentElement && document.documentElement.scrollTop) { scrollY = document.documentElement.scrollTop; } else if (document.body && document.body.scrollTop) { scrollY = document.body.scrollTop; } else if (window.pageYOffset) { scrollY = window.pageYOffset; } else if (window.scrollY) { scrollY = window.scrollY; } return scrollY; } LoginUI.centerDiv = function (div) { var top = ((LoginUI.getViewportHeight() - div.offsetHeight) / 2); if (top < 0) top = 10; div.style.left = ((LoginUI.getViewportWidth() - div.offsetWidth) / 2) + "px"; div.style.top = top + LoginUI.getViewportScrollY() + "px"; } LoginUI.showLogin = function () { $("#blockUI").css("height", window.document.body.clientHeight + "px"); $("#popmap").css("position", "absolute").css("z-index", "60000"); $("#popmap").show(); LoginUI.centerDiv(document.getElementById("popmap")); document.getElementById("blockUI").style.display = "block"; document.getElementById("blockUI").style.height = LoginUI.getViewportHeight() + LoginUI.getViewportScrollY() + "px"; } LoginUI.hideLogin = function () { document.getElementById("blockUI").style.display = "none"; document.getElementById("popmap").style.display = "none"; } window.onscroll = function () { var top = document.documentElement.scrollTop == 0 ? document.body.scrollTop : document.documentElement.scrollTop; var blockUIHight = $("#blockUI").css("height"); var popmapHight = $("#popmap").css("height"); var topHight = parseInt(top) + parseInt(popmapHight); if (topHight <= parseInt(blockUIHight)) { document.getElementById("popmap").style.top = top + 50 + "px"; } }</script> </head> <body><a href="#" id="map">弹出</a> <div class="Outer_layer"> <div id="popmap" style="display: none;100px;height:100px;border:red solid 1px"> <a href='#' class='close'>关闭</a> </div> </div> </div> <script type="text/javascript"> //关闭提示框 var pop_box = function (a, b) { var box = $(a + ">" + b) box.click(function () { $(a).hide(); LoginUI.hideLogin(); }) } pop_box("#popmap", ".close") //点击显示提示框 var show_box = function (a, b) { $(b).addClass("d_non"); $(a).click(function () { $(b).show(); LoginUI.showLogin(); }) } show_box("#map", "#popmap") </script> <div id="blockUI" class='ma' onclick="return false" onmousedown="return false" onmousemove="return false" onmouseup="return false" ondblclick="return false"> </body> <style> .ma { position:fixed; _position:absolute; left:0; top:0; _top:expression(eval(document.documentElement.scrollTop)); 100%; height:100%; background-color:#000; z-index:999; opacity:0.1; filter:alpha(opacity=50); display:none;} </style>