如何从网页中打开一个小框进行选择

How to open a small box from a web page to make a choice

本文关键字：一个 选择 行选 网页      更新时间：2023-09-26

所以我是javascript, html和css的新手，目前正在创建游戏web应用程序。我想能够有一种弹出框，当你点击一张卡出现在屏幕中间显示的选项，你可以点击该卡(同时主页的颜色变暗)，当你选择这些选项之一，它消失了(或者如果你点击弹出)。

我不确定我是否解释得很好，但我甚至不知道该在网上查什么，因为我不知道那叫什么，甚至不知道从哪里开始。什么好主意吗?

在你的html和a:

<div id="test"></div>
<div id="card"></div>

给diff一个背景色，使用rgba来启用透明度，默认显示值设置为none，并给它100%的宽度和高度:

#test {
width: 100%;
height: 100%;
display: none;
background-color: rgba(255,255,255,0.6);
}

然后在javascript中，你可以使用事件监听器在点击时触发改变显示状态为block:

document.getElementById("card").addEventListener("click", function() {
    document.getElementById("test").style.display = "block";
});

这里是一个jsfiddle，你可以查看一下:点击

相关文章：