使div浮动其他内容

时间:2016-12-24 02:26:35

标签: javascript html dom

我注意到使用提醒功能,出于安全原因你无法更改标题或将图像添加到其中但我仍然需要为我的游戏制作类似的东西,所以我决定制作一个div但是我需要它将鼠标悬停在整个页面上,但正如您将在代码段中看到的那样,在页面下方未显示,有人可以告诉我如何解决此问题。



//the function for the button
var no = function(){
  //the div
  var div= document.createElement("div");
  div.style.height="400px";
  div.style.background="red";
  div.innerHTML="<h1>what!</h1><p>im not alive</p>";
  document.body.appendChild(div);
};
&#13;
<!--what i want the div to hover over-->
<h1>hello world</h1>
<p>am i alive</p>
<button onclick="no()">press me to find out</button>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:3)

您需要使用以下内容:

  1. 职位:应为fixed
  2. 协调:应该集中。
  3. 使用CSS进行样式设置,使用JavaScript进行交互。
  4. <强>段

    &#13;
    &#13;
    //the function for the button
    var no = function() {
      //the div
      var div = document.createElement("div");
      div.innerHTML = "<div class='mask'><h1>what!</h1><p>im not alive</p></div>";
      document.body.appendChild(div);
    };
    &#13;
    .mask {
      position: fixed;
      left: 0;
      right: 0;
      top: 0;
      bottom: 0;
      background: #f00;
      z-index: 100;
    }
    &#13;
    <!--what i want the div to hover over-->
    <h1>hello world</h1>
    <p>am i alive</p>
    <button onclick="no()">press me to find out</button>
    &#13;
    &#13;
    &#13;