Bootstrap模式不呈现iframe

无法完全弄清楚是什么导致这里出现故障。但是我直接从Bootstrap网站上的模式示例中拉取。试图嵌入Spotify iFrame失败。任何关于如何获取内容呈现的指针？ aka期望的结果将是播放spotify播放列表的能力。Bootstrap模式不呈现iframe

<!-- Modal --> 
    <div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> 
    <div class="modal-header"> 
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> 
    <h3 id="myModalLabel">Modal header</h3> 
    </div> 
    <div class="modal-body"> 
     <iframe src="https://embed.spotify.com/?uri=spotify:user:1270558680:playlist:6nfXkdY7eZwINySrDHIFiV" width="300" height="380" frameborder="0" allowtransparency="true"></iframe> </div> 
     <div class="modal-footer"> 
    <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button> 
     <button class="btn btn-primary">Save changes</button>

来源

2013-12-23 user3130618

它看起来像你缺少“模式，对话”的div中，“模态内容” DIV，和一些封闭的div。

我直接复制的模式例如，从引导网站，插入你的iframe和它的工作（Here's a fiddle）。下面是从引导网站上的例子模式：当您加载，这就是为什么当你点击负载模式不显示的iFrame的很大一部分的页面

<!-- Button trigger modal --> 
<button class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal"> 
    Launch demo modal 
</button> 

<!-- Modal --> 
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> 
<div class="modal-dialog"> 
<div class="modal-content"> 
    <div class="modal-header"> 
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> 
    <h4 class="modal-title" id="myModalLabel">Modal title</h4> 
    </div> 
    <div class="modal-body"> 
    ... 
    </div> 
    <div class="modal-footer"> 
    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
    <button type="button" class="btn btn-primary">Save changes</button> 
    </div> 
</div><!-- /.modal-content --> 
</div><!-- /.modal-dialog --> 
</div><!-- /.modal -->

来源

2013-12-23 21:21:17 ringstaff

但为什么当我把谷歌或https://www.facebook.com/在它不工作？ –

IFrame，这是不是在正确的位置显示。

你有没有尝试过：http://www.bootply.com/61676

来源

2014-02-25 17:07:18 doizuc

-1

您可以使用eModal,js！ （5KB只）

的简单方法：

eModal.iframe("https://embed.spotify.com/?uri=spotify:track:0YtFqZhheQZIrVc0qbqL8D")

一些化妆：

eModal.iframe({ 
    url: "https://embed.spotify.com/?uri=spotify:track:0YtFqZhheQZIrVc0qbqL8D", 
    size:eModal.size.sm, 
    title:"Da weasel"});

此lib中也支持AJAX，警报，promp或确认。

没有HTML需要！

来源

2015-06-30 00:15:29

不回答问题.. – Gogol

Bootstrap模式不呈现iframe

回答

相关问题