当前位置:首页 > 网站应用

js弹出居中窗口特效

cjw1233年前 (2023-11-01)网站应用8130
<html>
<head>
<title>弹出窗口效果</title>
<style>
.black_overlay{display:none;position:absolute;top:0%;left:0%;width:100%;height:100%;background-color: black;z-index:1001;  -moz-opacity: 0.8;opacity:.80;filter:alpha(opacity=80);}
.www {display:none;position:absolute;top:25%;left: 25%;width:50%;height:50%;padding:16px;border:16px solid orange;background-color: white;z-index:1002;overflow:auto;}
</style>
</head>
<body>
<p><a href="javascript:void(0)" onclick="document.getElementById('light').style.display='block';document.getElementById('fade').style.display='block'">点击这里弹出窗口</a></p>
<div id="light" class="www">
 www.cjw123.com<br/>可以设置公告内容,或者打赏内容。
 <a href="javascript:void(0)" onclick="document.getElementById('light').style.display='none';document.getElementById('fade').style.display='none'">
 关闭</a></div>
<div id="fade" class="black_overlay">
</div>
</body>
</html>


扫描二维码推送至手机访问。

版权声明:本文由追求完美发布,如需转载请注明出处。

本文链接:https://cjw123.com/blog/?id=43

标签: JS
分享给朋友:

相关文章

html meta标签屏蔽搜索引擎的用法

html页面中的 meta 标签可以用来识别搜索引擎的蜘蛛类型,可以规定meta标签所在的html页面是否被蜘蛛抓取,下面是这个meta标签的用法,大家可以借鉴一下。搜索引擎的 meta 标签的解析下面是meta标签对搜索引擎的解析<meta name='robot…

文字特效代码:超酷文字快速展示

<!--要完成此效果需要三个步骤 第一步:把如下代码加入到<head>区域中--> <style> .let{ color:white; font-family:Verdana; font-weight:bold; width:500; filte…

html中文本不停变色的特效

<HTML><HEAD><TITLE>文本特效篇--文本不停变色</TITLE> </HEAD> <BODY bgcolor="#fef4d2"> <br> <center…

状态码页面单页源码

可做为各种错误页!具体点下面的运行看演示<!DOCTYPE html> <html> <head>   <meta charset="UTF-8">   <m…

自建一个必应bing每日壁纸的存档及API调用

很多站点的背景都是采用的必应的每日壁纸,必应官方的API只能调用7天,想着如果有一个能回顾之前每一天的 Bing 壁纸就更好啦,所以按照自己的思路诞生了这个网站~ ✨ 功能特色 每日0:30自动更新必应官方壁纸 支持多分辨率下载(4K/1080P/移动端/等) 历史壁纸记录查询与搜索,本站开…

2026免费GoogleSSL无需翻墙

2026年博主亲测,免费好用的90天Google域名SSL证书注册平台,高效且无需VPN翻墙,支持邮件提醒续期。https://buruo.cn/这个站使用的就是GoogleSSL证书。注册登录:使用个人邮箱注册账号,进入控制台,无需实名认证,点击“免费SSL证书”。 证书申请:选择“Go…

发表评论

访客

看不清,换一张

◎欢迎参与讨论,请在这里发表您的看法和观点。