如何让通知消失

时间:2018-01-17 16:21:28

标签: javascript html css

我未能发出大约1秒后消失的通知,同时保持页面上的项目稍微变暗或褪色(看起来好像在后台)。这里对JavaScript知之甚少。

var notification = document.getElementById("one");
setTimeout(function() {
  notification.close()
}, 1000)
body {
  background: rgba(0, 0, 0, 0.75);
}

.notification {
  transition: all 0.35s;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  background: linear-gradient(#1abc9c, #16a085);
  border-bottom: 0.125rem solid #1abc9c;
  box-shadow: rgba(0, 0, 0, 0.4) 0 0.25rem 0.25rem 0;
}

.notification .content {
  text-align: center;
  color: #fff;
}
<div id="one" class="notification">
  <div class="content">
    <p>This is a notification</p>
  </div>
</div>
<div class="wrapper">
  <p>This is a text that i copied from someone: My father had a small estate in default link Nottinghamshire: I was the third of five sons. He sent me to Emanuel College in Cambridge at fourteen years old, where I resided three years, and applied myself
    close to my studies; but the charge of maintaining me, although I had a very scanty allowance, being too great for a narrow fortune, I was bound apprentice to Mr. James Bates, an eminent surgeon in London, with whom I continued four years. </p>
</div>

2 个答案:

答案 0 :(得分:4)

您需要将.close()更改为.style.visibility = 'hidden'

close()函数不是隐藏DOM元素的本机JavaScript函数。

var notification = document.getElementById("one");
setTimeout(function() {
  notification.style.visibility = 'hidden';
}, 1000)
body {
  background: rgba(0, 0, 0, 0.75);
}

.notification {
  transition: all 0.35s;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  background: linear-gradient(#1abc9c, #16a085);
  border-bottom: 0.125rem solid #1abc9c;
  box-shadow: rgba(0, 0, 0, 0.4) 0 0.25rem 0.25rem 0;
}

.notification .content {
  text-align: center;
  color: #fff;
}
<div id="one" class="notification">
  <div class="content">
    <p>This is a notification</p>
  </div>
</div>
<div class="wrapper">
  <p>This is a text that i copied from someone: My father had a small estate in default link Nottinghamshire: I was the third of five sons. He sent me to Emanuel College in Cambridge at fourteen years old, where I resided three years, and applied myself
    close to my studies; but the charge of maintaining me, although I had a very scanty allowance, being too great for a narrow fortune, I was bound apprentice to Mr. James Bates, an eminent surgeon in London, with whom I continued four years. </p>
</div>

答案 1 :(得分:0)

notification.style.display =“none”;

或,notification.style.visibility =“hidden”;