特定のCSSを選んだときにYouTube動画を再生することはできますか？

Question

私は、ドロップダウンメニューから、特定のCSSが選択されたときに異なるYouTube動画を表示して再生する方法を探しています。 JavaScriptを使ってCSSをチェックできると思っていました。

ページのhtmlヘッダーに追加します。

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

例えば/ CSS

red.css
blue.css

Red plays
Blue plays

たぶんビデオが表示されます場所のためのHTMLにdivファイルを追加します。コードをの埋込み

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

＃

ユーチューブ。

古い埋め込みコード：

<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> 

ユーチューブのiframeコード：

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

＃

（おそらくコードは、彼らが将来的にすべてのビデオのために使用しようとします）任意のアイデアJavaScriptをCSSに接続して、異なるYouTubeが表示されるようにするには、 か、これを行う簡単な方法がありますか？

Answer 1

document.styleSheetsをご覧ください。これはあなたのウェブページに関連付けられたスタイルシートの配列（順序付きリスト）です。与えられたスタイルシートが適用されているか否かdisabled財産状態

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

：あなたはここに参照を見つけることができます。

したがって、スタイルシートを繰り返し、赤色または青色になると、適用されているかどうか（無効ではない）を確認できます。

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 
    } 

Answer 2

ウルは、ドロップダウンを使用して含まれてCSSを変更すると仮定イム.. yesの場合...その後ウルが変更された値を読み取り、.CSSファイルを変更したのと同じ選択されたイベントにuが、古いiFrameを削除することができますし、 JQUERYを使用して新しい..を追加することができます。