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

js弹出居中窗口特效

cjw1232年前 (2023-11-01)网站应用5470

<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://www.cjw123.com/blog/?id=43

标签: JS

分享给朋友：

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

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

css3动画实现滚动字，类似航班信息，超出滚动，不超出不滚动

文字走马灯，手机的弹幕等等。js可以动态的计算宽度，但js做动画需要定时器，很不方便。其实就是里外容器对向滚动，滚动的值为里外容器宽度的差值，如果里容器与外容器等宽，那么差值就为0，视觉上是没有滚动的，就像第一条数据；如果里容器宽度比外容器宽，里容器向左滚动的距离比外容器向右滚动的距离大，就会形成滚…