html - 如何使用 bootsrap3 嵌入 youtube 播放器和 facebook api?

标签 html css facebook youtube embed

每个人。

我叫科迪,是一名学生/业余网页设计师,受雇为一位家庭 friend 创建网站。

我正在使用 bootstrap3 使网站响应,但我在尝试将 youtube 播放器 API 和 facebook 页面 API 一起嵌入网站主页时遇到问题。

col-8 应该用作主要内容区域,而 col-4 用作侧边栏/共享部分。

该页面正确呈现 youtube 播放器,但不显示任何带有 col-4 或之后的内容。 但是,如果我禁用 youtube 播放器,该页面将正确加载。

如果你能帮我找出问题所在,那就太棒了。

<body>
<div class="container row">
    <div class="col-sm-8">.col-sm-8
        <h3>What is Roger's Lake of the Woods Adventures?</h3>
        <p>testing testing</p>
        <!-- Youtube Player API Placement -->
        <div class="embed-responsive embed-responsive-16by9">
        <iframe class="embed-responsive-item"
        id="ytplayer" 
        type="text/html" 
        src="http://www.youtube.com/embed/M7lc1UVf-VE?autoplay=0&origin=http://lakeofthewoodsadventures.com" 
        />
        </div>
        <!-- End of Youtube Player API Placement -->
    </div>
    <div class="darkBG col-sm-4">
    <!-- Facebook Page Feed API Placement -->
        <div class="fb-page" data-href="https://www.facebook.com/pages/Rogers-Lake-of-the-Woods-Adventures/597978003639919" 
        data-width="280" 
        data-hide-cover="true" 
        data-show-facepile="false" 
        data-show-posts="true">
        <div class="fb-xfbml-parse-ignore">
        <blockquote cite="https://www.facebook.com/pages/Rogers-Lake-of-the-Woods-Adventures/597978003639919">
        <a href="https://www.facebook.com/pages/Rogers-Lake-of-the-Woods-Adventures/597978003639919">
        Roger&#039;s Lake of the Woods Adventures
        </a>
        </blockquote>
        </div>
        </div>
    <!-- End of Facebook Page Feed API Placement -->
    </div>
</div>
<script src="Local Bootstrap/js/bootstrap.min.js"></script>
</body>

谢谢! - 科迪

最佳答案

<iframe src="">youtube code**</iframe>**

您必须打开和关闭 iframe 标记。

关于html - 如何使用 bootsrap3 嵌入 youtube 播放器和 facebook api?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29855108/

相关文章:

facebook - Facebook 共享器中的描述最大限制

javascript - HTML5 Canvas Base64 错误

jquery - 显示后选项的高度搞砸了

jquery - Nivo Slider - 仅显示静态图像

javascript - 文档类型不允许在此处使用元素 "h4"

facebook - 使用图形 API 从用户中删除应用程序

html - 通过 API 的 Facebook 帖子 - 包括 html、css 和外部图像?

jquery - 修复原来不在顶部的 2 行在向下滚动时粘在页面顶部

jquery - 如何使用 jQuery 在 <li> 上添加当前 div?

javascript - 为 HTML Canvas 创建自己的过滤器