Question

我知道我可以用jquery来完成这个，但是我想在纯javascript中完成它。问题是我无法包含任何文件链接。

我会在内容中加载iframe几秒钟。

这里是我的jquery，它的工作方式应该如此......但我需要帮助才能使用js完全相同的功能。

<html>
<head>

<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>

<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<link href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" />

</head>

<script language="javascript">
$(document).ready( function() {
  $('#overlay').modal('show');

  setTimeout(function() {
      $('#overlay').modal('hide');
  }, 5000);
});
</script>

<div class="modal hide fade" id="overlay">
    <div class="modal-header">
      <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
      <h4 class="modal-title">Leader Board</h4>
    </div>
    <div class="modal-body">
      <p><iframe src="formers" width="90%" height="90%"></iframe></p>
    </div>
</div>

非常感谢任何帮助。谢谢。

Answer 1

所以你只想在5秒后显示一个元素onload并隐藏？

<script>
window.onload=function(){
    document.getElementById('overlay').style.display = 'block';

    setTimeout(function(){
    document.getElementById('overlay').style.display = 'none';
    },5000);
};
</script>

Answer 2

这应该有效

<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>

<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<link href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" />

<script language="javascript">
function popUp() {
  document.getElementById('#overlay').modal('show');

  setTimeout(function() {
      document.getElementById('#overlay').modal('hide');
  }, 5000);
});
</script>

</head>

<body onload="popUp()">
<div class="modal hide fade" id="overlay">
    <div class="modal-header">
      <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
      <h4 class="modal-title">Leader Board</h4>
    </div>
    <div class="modal-body">
      <p><iframe src="formers" width="90%" height="90%"></iframe></p>
    </div>
</div>
</body>

我正在寻找一个在页面加载后发生的javascript弹出窗口，而不是在几秒钟后消失

2 个答案: