【问题标题】：Is it possible to have a youtube video play when a certain CSS is picked?选择某个 CSS 时是否可以播放 youtube 视频？
【发布时间】：2012-04-21 09:35:31
【问题描述】：

我正在寻找一种在从下拉菜单中选择特定 CSS 时显示和播放不同 youtube 视频的方法。我在想 JavaScript 可以用来检查 CSS。

添加到页面的 html 标头。

<script type="text/javascript" src="=./javascript/playvid4css.js"></script>

例如/ CSS

red.css
蓝色.css

Red plays
Blue plays

可能会在 html 中添加一个 div 文件来显示视频的位置。

<div id="yvideo"></div>

#

youtube 嵌入代码。

旧嵌入代码：

<object width="420" height="315">
    <param name="movie" value="http://www.youtube.com/v/N9ync7sLSd4?version=3&amp;hl=en_GB&amp;rel=0"></param>
    <param name="allowFullScreen" value="true"></param>
    <param name="allowscriptaccess" value="always"></param>
    <embed src="http://www.youtube.com/v/N9ync7sLSd4?version=3&amp;hl=en_GB&amp;rel=0" type="application/x-shockwave-flash" width="420" height="315" allowscriptaccess="always" allowfullscreen="true"></embed>
</object>

youtube iframe 代码：（可能是他们将来尝试用于所有视频的代码）

<iframe width="420" height="315" src="http://www.youtube.com/embed/N9ync7sLSd4?rel=0" frameborder="0" allowfullscreen></iframe>

#

关于如何将 JavaScript 连接到 CSS 以便出现不同的 youtube 的任何想法，还是有更简单的方法？

【问题讨论】：

标签： javascript css html youtube embed

【解决方案1】：

查看document.styleSheets - 它是与您的网页相关联的样式表数组（有序列表）。你可以在这里找到参考：

https://developer.mozilla.org/en/DOM/stylesheet

disabled 属性表明给定的样式表是否已被应用。

因此，您可以遍历样式表，当您遇到红色或蓝色时，检查它们是否已应用（未禁用）。

var i;
for (i = 0; i < document.styleSheets.length; i++)
    if (document.styleSheets[i].href == "myRedStyleSheet.css" && 
        !document.styleSheets[i].disabled) {

            // code for the red stylesheet

    } else if (document.styleSheets[i].href == "myBlueStyleSheet.css" && 
               !document.styleSheets[i].disabled) {

            // code for the blue stylesheet
    }

【讨论】：

【解决方案2】：

我假设您使用下拉菜单更改包含的 css.. 如果是.. 然后在您读取更改的值并更改 .CSS 文件的同一选定事件上，您还可以删除旧的 Iframe 并添加一个新的。 . 这很容易.. 使用 JQUERY 进行 sply

【讨论】：

请帮助我改进并留下评论，描述你在做这件事时投反对票的理由......谢谢
拼写，没有代码，没有例子，没有什么突出的，所以没有格式，我什至不会看这篇文章。