js学习--开屏弹窗

简介: js学习--开屏弹窗

开屏弹窗制作

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title></title>
    <style>
      * {
        padding: 0;
        margin: 0;
      }
 
      .bulletin {
        width: 80%;
        height: 550px;
        background-color: aqua;
        text-align: center;
        margin-left: 10%;
        line-height: 25px;
      }
 
      .title {
        width: 100%;
        height: 60px;
        background: red;
        line-height: 60px;
      }
 
      #But {
        width: 80%;
        height: 60px;
        background: yellow;
        border-radius: 20px;
      }
    </style>
  </head>
  <body>
    <div class="bulletin">
      <div class="title">
        <h1>和平精英游戏群公告文案</h1>
      </div>
      亲爱的和平精英游戏群成员们,大家好!<br />
      作为本群的管理者,我们希望为大家创造一个友好、积极和健康的游戏环境。为了确保群内 <br />
      秩序井然,提升群友的游戏体验,我们制定了以下群公告:<br />
      1. 尊重他人:请大家保持彼此的互相尊重和礼貌,不进行恶意攻击、人身攻击、侮辱、辱骂 <br />
      等言论。<br />
      2. 合法合规:请大家遵守游戏的使用规定和中国相关法律法规,不进行任何形式的非法活动<br />
      和违规行为。 <br />
      3. 信息分享:欢迎大家在群内进行游戏心得、经验分享,但请不要传播虚假信息、谣言等,<br />
      以免给他人带来困扰和误导。<br />
      4. 聊天内容:请大家保持聊天内容积极向上,不讨论政治敏感话题、低俗色情、暴力恐怖等<br />
      不适宜的内容。<br />
      5. 团队协作:和平精英是一个团队合作的游戏,我们鼓励大家团结协作,互相帮助和支持。<br />
      6. 反馈建议:如果大家在游戏中遇到任何问题或有任何建议,欢迎大家及时向管理组反馈,<br />
      我们会尽快处理和解决。<br />
      最后,希望大家共同遵守以上规定,共同营造一个和谐、友好的游戏群。只有大家一起努力,<br />
      才能让游戏群更加繁荣和精彩!谢谢大家的支持和配合!<br />
      如果大家对群规有任何疑问,请随时向管理组咨询。祝大家游戏愉快,再见!
      <button id="But">确认</button>
    </div>
    <script>
      let but = document.getElementById('But');
      let bul = document.getElementsByClassName('bulletin')[0];
      (function() {
        if (sessionStorage.getItem('a') == 1) {
          bul.style.display = 'none';
        } else {
          bul.style.display = 'block';
        }
      }())
      but.onclick = function() {
        sessionStorage.setItem("a", 1);
        bul.style.display = 'none';
      }
      
    </script>
  </body>
</html>
相关文章
|
22天前
|
Web App开发 JavaScript 前端开发
如何学习JavaScript?
如何学习JavaScript?
37 5
|
2月前
|
JavaScript 前端开发 开发者
VUE 开发——Node.js学习(一)
VUE 开发——Node.js学习(一)
75 3
|
2月前
|
机器学习/深度学习 JavaScript 前端开发
JavaScript 弹窗
JavaScript 弹窗
45 1
|
21天前
|
JavaScript 前端开发 索引
JavaScript学习第二章--字符串
本文介绍了JavaScript中的字符串处理,包括普通字符串和模板字符串的使用方法及常见字符串操作方法如`charAt`、`concat`、`endsWith`等,适合前端学习者参考。作者是一位热爱前端技术的大一学生,专注于分享实用的编程技巧。
21 2
|
21天前
|
存储 JavaScript 前端开发
JavaScript学习第一章
本文档介绍了JavaScript的基础知识,包括其在网页中的作用、如何通过JavaScript动态设置HTML元素的CSS属性,以及JavaScript中的变量类型(`var`、`let`、`const`)和数据类型(基本数据类型与引用数据类型)。通过实例代码详细解释了JavaScript的核心概念,适合初学者入门学习。
46 1
|
2月前
|
JavaScript
js学习--制作猜数字
js学习--制作猜数字
38 4
js学习--制作猜数字
|
2月前
|
JavaScript
webpack学习五:webpack的配置文件webpack.config.js分离,分离成开发环境配置文件和生产环境配置文件
这篇文章介绍了如何将webpack的配置文件分离成开发环境和生产环境的配置文件,以提高打包效率。
52 1
webpack学习五:webpack的配置文件webpack.config.js分离,分离成开发环境配置文件和生产环境配置文件
|
3月前
|
算法 JavaScript 前端开发
第一个算法项目 | JS实现并查集迷宫算法Demo学习
本文是关于使用JavaScript实现并查集迷宫算法的中国象棋demo的学习记录,包括项目运行方法、知识点梳理、代码赏析以及相关CSS样式表文件的介绍。
第一个算法项目 | JS实现并查集迷宫算法Demo学习
|
3月前
|
JavaScript 前端开发 API
紧跟月影大佬的步伐,一起来学习如何写好JS(上)
该文章跟随月影老师的指导,探讨了编写优质JavaScript代码的三大原则:各司其职、组件封装与过程抽象,通过具体示例讲解了如何在实际开发中应用这些原则以提高代码质量和可维护性。
紧跟月影大佬的步伐,一起来学习如何写好JS(上)
|
2月前
|
JavaScript
js学习--制作选项卡
js学习--制作选项卡
38 4