本文通过一个例子告诉大家，JS可以通过模仿微博来关闭弹出层。分享给大家参考。具体如下：

这里推荐一个真正好的JavaScript网页弹出层，模仿微博JS就可以关闭，点击按钮就可以弹出。可以做成网页客服等。比如这样一个按钮显示在网页右侧，点击时图层展开显示客服QQ，效果还是很不错的！

运行效果截图如下：

在线演示地址如下：

http://demo . JB 51 . net/js/2015/js-f-Weibo-close-able-alert-codes/

具体代码如下：

！DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN ' ' http://www .w3。org/TR/XHTML 1/DTD/XHTML 1-Transitional。DTD ' html xmlns=' http://www .w3。org/1999/XHTML ' hearteta http-equiv=' Content-Type ' Content=' text/html；字符集=GB 2312/标题圆角弹出层DIV CSS/标题样式正文{ font-size :12 px}.tit { font-size :14 px划水：0;边距：0高：31像素线高：31 px背景： URL(图片/titbg。gif)中心顶部重复-x # CBE4EF；}.tit b { float:left边距-左侧：15像素；}.tita { float : right右边距：5 px页边距-top :6 px；display : inline } a . cls { height :18 px；宽度：18 px显示：块；飞越：隐藏；行高：200 px}.NR { padd :10 text-align : left；}a.cls，a.cls:link，a . cls :访问了{ background : URL(images/cls。gif)中心0不重复；} a . cls :悬停{背景： URL(图像/cls。gif)中心-20px无重复；}.box{ border:1px #999999固体；背景： # FFF；}/*圆角边框*/.中尉rt .磅Rb { background-image : URL(images/abg。巴布亚新几内亚)；filter:alpha(不透明度=10);-moz-opa市3360.1；opacity:1线高：0;}.中尉rt .磅rb { height:6px宽度：6 px}.t .b ,我r { background : # 000000 filter : alpha(不透明度=10);-moz-opa市3360.1；opacity:1线高：0;}.我r { width:6px}。t .b { height:6px}。lt{背景-位置：0 0;}.rt {背景-位置：右0；}.磅背景-位置：0底部；}.rb{背景-位置：右下方；}/*小三角*/s {位置：绝对；top :-13px；* top :-13px；左侧：50像素显示：块；高度：0;宽度：0;字号：0；线高： 0;边框-颜色：透明透明# 666透明；边框样式：虚线实心虚线；边框宽度：10 px} I { position : absolutetop :-9px；* top :-9px；左侧：-10px；显示：块；高度：0;宽度：0;font-size : 0；边框宽度：10 px线高： 0;边框颜色：透明透明#FFF透明；边框样式：虚线实心虚线；}.打开{位置：相对宽度宽度：150像素宽度：25像素线高：180%;border:1px实心# FF9900背景# FFCC00余量：12%自动0 400像素文本对齐：居中；}.打开span { cursor:pointer显示：块；宽度：100%;}.odiv { position : absolutetop :29 pxleft :-1px；宽度width:300px}/style脚本类型=' text/JavaScript '函数openshut manager(oSourceObj，oTargetObj，shutAble，oOpenTip，oshut pit){ var sourceObj=oSourceObj的类型==' string '？文件。getelementbyid(oSourceObj): oSourceObj；var targetObj=类型oTargetObj==' string '？文件。getelementbyid(Otargetbj): Otargetbj；var openTip=OOP entip | | var shut IP=OsHouttip | | if(TargetObj . style . display！='none'){ if(shutAble)返回；目标对象。风格。显示='无'；if(openTip关闭IP){ source obj。innerhtml=关闭IP；} } else { TargetObj。风格。display=' blockif(OpenTip ShutIP){ source obj。innerhtml=openTip} } }/script/head dydiv class=' open ' span onclick=' open shut manager '(此为框中，假点击这里，关闭层','点击这里，弹出层')'点击这里，弹出层/span div class=' odiv ' id=' box ' style=' display : none '表格边框=' 0 '单元格填充=' 0 '单元格间距=' 0 ' trtd class=' lt '/tdtd class=' t '/tdtd class=' rt '/TD/trtd class=' l '/tdtd class=' box ' H3 class=' tit '这里是标题a class=' cls ' href=' JavaScript :onclick='openShutManager '(此为box '，false)' title='关闭'关闭/a/h3 div class='nr '提示：br/1、在代码状态下使用[html][/html]可以贴"代码运行"的代码。并禁用发帖左侧的统一资源定位器识别和标签解析br/2、技术版面请勿灌水。特别受欢迎的主题可以顶一顶，但是请接受版主的定期"擦水",这是为了减少技术讨论区出现的无效信息br/3、如需要收藏主题，请使用主题右上角的链接，还可以推荐给论坛里的朋友br /此方法简单，自适应内容高宽，易方便改风格。

/div/tdtd class=' r '/TD/trtd class=' lb '/tdtd class=' b '/tdtd class=' Rb '/TD/tr/tablesi/I/s/div/div/body/html希望本文所述对大家的Java脚本语言程序设计有所帮助。