流页面

我已经看到上网本网站时，一个惊人的事情：流页面

http://www.free-css.com/free-css-templates/page202/flat-theme

当你点击现场演示，它会打开在当前页面的其他页面，而不会重定向或打开另一个窗口。

我想在我的网站上做同样的事情，我尝试了很多东西，但都没有成功。任何想法如何做到这一点？

来源

2016-09-23 aghed aljlad

更多信息添加你的代码了。让我们看看你的尝试..我们将帮助你与我们的代码..或让小提琴 –

尝试在Bootstrap框架中使用'模态'。你可以改变模态的尺寸。 http://getbootstrap.com/javascript/ –

这是因为你没有要求答案，你正在寻求教程。 – luissimo

你问的iframe，你可以阅读更多关于它W3schools

约弹出，你可以使用Bootstrap Modal

这里是一个 Demo你想要的东西，所以你可以尝试

代码：

.btn { 
 
    margin: 20px; 
 
} 
 
.modal-content { 
 
    width: 800px; 
 
}

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
 
<script src="https://code.jquery.com/jquery-3.1.0.min.js"></script> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 
<!-- Trigger the modal with a button --> 
 
<button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#myModal">Open Modal</button> 
 

 
<!-- Modal --> 
 
<div id="myModal" class="modal fade" role="dialog"> 
 
    <div class="modal-dialog"> 
 

 
    <!-- Modal content--> 
 
    <div class="modal-content"> 
 
     <div class="modal-header"> 
 
     <button type="button" class="close" data-dismiss="modal">&times;</button> 
 
     <h4 class="modal-title">Modal Header</h4> 
 
     </div> 
 
     <div class="modal-body"> 
 
     <!-- this is where you got the other page you want to show --> 
 
.  <iframe src="http://www.w3schools.com/html/html_iframe.asp" height="500" width="750"> 
 
     
 
     </iframe> 
 
     </div> 
 
     <div class="modal-footer"> 
 
     <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
 
     </div> 
 
    </div> 
 

 
    </div> 
 
</div>

来源

2016-09-23 22:49:18

谢谢你，我已经想通了一个新的问题，我想要在模式中嵌入视频，问题是当模式淡出视频继续播放？ –

@aghedaljlad我为此添加了另一个答案，请检查它 –

您正在讨论的示例通过iframe加载。请参见下面的例子：

<iframe src="http://www.w3schools.com"></iframe>

我猜你通常会得到downvoted的原因是因为你不注意任何做出很好的格式化，甚至拼写正确的问题。

另外，这是非常基础的知识。你可以在网上找到关于它的文档。绝对没有理由再次提出这个问题，所以自然会让你失望。

来源

2016-09-23 22:15:34

当我问一个问题，我总是有点生气，这就是为什么..... –

和我正在寻找超过五天，找不到任何东西 –

那么，做一个搜索[“如何嵌入网页到html“]（https://www.google.com/search?q=how%20to%20embed%20webpage%20into%20html&rct=j），并且没有必要再生气 –

关于视频您的问题尝试将此代码添加到您的js

$("#myModal").on('hidden.bs.modal', function (e) { 
    $("#myModal iframe").attr("src", $("#myModal iframe").attr("src")); 
});

Demo

你可以找到在这个Question

来源

2016-09-23 23:26:23

再次感谢你@Aya你的答案对我来说是一个很好的帮助 –

回答

相关问题