处理不同覆盖层ID的方法：使用相同的JavaScript函数-PHP中文网问答

我想要为不同的链接显示覆盖层。第一个覆盖层包含图片和文本，而如果我们点击链接2，它必须显示具有相同结构但不同内容的覆盖层2。请帮助我获得所需的输出。

function on() { document.getElementById("overlay").style.display = "block"; } function on1() { document.getElementById("overlay1").style.display = "block"; } function off() { document.getElementById("overlay").style.display = "none"; }

.img { transition: transform 5s ease-in-out; transform: scale(1); transform-origin: 0 0; } .img:hover { transform: scale(1.25) } #overlay, #overlay1 { position: fixed; display: none; width: 100%; height: 100%; top: 0; left: 0; right: 0; bottom: 0; background-color: white; z-index: 77777772; cursor: pointer; } #text, #text1 { position: fixed; top: 20%; left: 5%; //font-size: 50px; color: black; // transform: translate(-50%,-50%); // -ms-transform: translate(-50%,-50%); }

   XXX
 ZZZ
  帮助发掘居住在山谷中的人们的巨大才华。 
 
   
 
  
  
    AAA
 MMM
 帮助发掘居住在山谷中的人们的巨大才华。 
 
   
 
  
  
 
 
 阅读更多 -> 阅读更多 -> 1. 列表项

.img { transition: transform 5s ease-in-out; transform: scale(1); transform-origin: 0 0; } .img:hover { transform: scale(1.25) } #overlay, #overlay1 { position: fixed; display: none; width: 100%; height: 100%; top: 0; left: 0; right: 0; bottom: 0; background-color: white; z-index: 77777772; cursor: pointer; } #text, #text1 { position: fixed; top: 20%; left: 5%; font-size: 50px; color: black; transform: translate(-50% -50%); -ms-transform: translate(-50% -50%); }