iframe youtube

iframe youtube

playlist=XXXXXXX; loop=1 重複播放。
autoplay=1 自動播放。
rel=0 不顯影片完結推廣。
controls=0 不顯示播放器控制選項。
showinfo=0 不顯示影片標題及播放器操作選項。
mute=1  影片當背景，並靜音。

<iframe id="ifsrc"  width="800" height="500" src="
https://www.youtube.com/embed/mtmctzyCdNk?autoplay=1;playlist=mtmctzyCdNk;loop=1;rel=1;controls=0;showinfo=0;" ></iframe >

<table border="1"> <table border="1"><tbody><tr><td style="padding:20px"><label id="autoplay" class="container">自動播放 <input type="checkbox" onclick="ifautoplay(this)" > <span class="checkmark"></span></label><label class="container">重複播放 <input type="checkbox" onclick="ifloop(this)"> <span class="checkmark"></span></label><label class="container">完結推廣 <input type="checkbox" onclick="ifrel(this)"> <span class="checkmark"></span></label><label class="container">播放器控制選項 <input type="checkbox" onclick="ifcontrols(this)"> <span class="checkmark"></span></label><label class="container">顯示標題操作選項。 <input type="checkbox" onclick="ifshowinfo(this)"> <span class="checkmark"></span></label> </td><td><iframe id="ifsrc" width="800" height="500" src=" "></iframe></td></tr><tr><td colspan="2"><div id="srcDP" style="font-size: 22px;"></div></td></tr></tbody></table><style>.container { display: block; position: relative; padding-left: 35px; margin-bottom: 12px; cursor: pointer; font-size: 22px; } .container input { position: absolute; opacity: 0; cursor: pointer; } .checkmark { position: absolute; top: 0; left: 0; height: 25px; width: 25px; background-color: gray ; } .container:hover input ~ .checkmark { background-color: magenta;} .container:hover { color: magenta;} .container input:checked ~ .checkmark { background-color: #2196F3;} .checkmark:after { content: ""; position: absolute; display: none; } .container input:checked ~ .checkmark:after { display: block; } .container .checkmark:after { left: 9px; top: 5px; width: 5px; height: 10px; border: solid white; border-width: 0 3px 3px 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg);} </style> <script type="text/javascript"> var ifData1 = "https://www.youtube.com/embed/A0_6GYztIM0?" var ifData2 = "autoplay=0;" var ifData3 = "" var ifData4 = "rel=0;" var ifData5 = "controls=0;" var ifData6 = "showinfo=0;" function idsrc(){ var fsrc = ifData1 + ifData2 + ifData3 + ifData4 + ifData5 + ifData6 ; document.getElementById('ifsrc').src= fsrc ; document.getElementById('srcDP').innerHTML = fsrc ; } idsrc(); function ifautoplay(x){ if(x.checked){ifData2 = "autoplay=1;"} else{ifData2 = "autoplay=0;"} idsrc(); } function ifloop(x){ if(x.checked){ifData3 = "playlist=mtmctzyCdNk;loop=1;"; } else{ifData3 = ""; } idsrc(); } function ifrel(x){ if(x.checked){ifData4 = "rel=1;" } else{ifData4 = "rel=0;"; } idsrc(); } function ifcontrols(x){ if(x.checked){ifData5 = "controls=1;" } else{ifData5 = "controls=0;"; } idsrc(); } function ifshowinfo(x){ if(x.checked){ifData6 = "showinfo=1;" } else{ifData6 = "showinfo=0;"; } idsrc(); } idsrc(); </script>

00