Youtube視頻彈出可在Mac和ios上使用，但不能在任何PC上使用

我建立了一個網站，當訪問者點擊播放按鈕時，它會彈出一個youtube視頻，下面是我的代碼。它適用於iPad，iPhone和Mac，但不適用於PC。有人會善意向我解釋我做錯了什麼，以及爲什麼彈出窗口不能在PC上打開YouTube視頻？該鏈接仍然有效，因爲我可以在新標籤頁中打開該視頻，它只是在彈出窗口時不會自動打開。我已經在3臺PC上進行了測試，但沒有任何結果。Youtube視頻彈出可在Mac和ios上使用，但不能在任何PC上使用

謝謝你們。

HTML

<div class="description centerAbsolute"> 
    <h1 class="proximaBold antialiased"><span class="style8">BIG</span>SMILE</h1> 
    <h2 class="proximaLite antialiased">Cambridge</h2> 
    <a href="http://youtu.be/krlR2-YGk4sI" target="_blank" class="play clearfix proximaBold relative"><span class="cta floatL">through the eyes of a customer</span><span class="playIco floatL"></span></a> 
</div>

CSS

/* --- VIDEO --- */ 
#main>header>.video>#youtube{opacity: 0; background: rgba(0, 0, 0, 0.6);} 
#main>header>.video>#youtube>.close{ 
    width: 40px; 
    height: 40px; 
    top: 50%; 
    left: 0px; 
} 
#main>header>.video>#youtube>.close>a{ 
    display: block; 
    width: 40px; 
    height: 40px; 
    background: url(../img/close%402x.png) no-repeat center; 
    background-color: #32ADC3; 
    background-size: 40px; 
    vertical-align: bottom; 
} 
#main>header>.video{width:100%; height:500px; background:url(../img/bg-video.jpg) no- repeat center top; background-size:cover; color:#FFF; } 
#main>header>.video>.description{width:700px; margin-top:-185px; margin-left:-350px; text-align:center;} 
#main>header>.video>.description>h1{font-size:118px; line-height:118px; margin:0px 0px 0px 0px; letter-spacing:0.12em;} 
#main>header>.video>.description>h2{font-size:36px;line-height:35px; margin:15px 0px 0px 0px; letter-spacing:0.12em; -webkit-font-smoothing: antialiased;} 
#main>header>.video>.description>.play{text-decoration:none; color:#FFF; display:block; height:70px; width:650px; margin:40px auto 40px auto; background:#32ADC3;} 
#main>header>.video>.description>.play>.playIco{ display:block; width:70px; height:70px; background:url(../img/play-ico.png) center no-repeat; border-left:solid 1px #32ADC3;} 
#main>header>.video>.description>.play>.cta{ width:578px; font-size:16px; text-transform:uppercase; line-height:72px; letter-spacing:0.25em;-webkit-font-smoothing: antialiased;} 
#main>header>.video>.description>.share{ width:140px; margin:auto;} 
#main>header>.video>.description>.share>h3{width:136px; font-size:12px; line-height:16px; margin:auto; text-align:center; letter-spacing:0.3em;} 
#main>header>.video>.description>.share>h3>.title{ margin:auto 18px auto 18px;} 
#main>header>.video>.description>.share>h3>.line{ display:block; width:20px; height:1px; margin-top:5%; border-top:solid 1px #FFF;} 
#main>header>.video>.description>.share>ul{ margin-left:-8px; margin-bottom:0px;} 
#main>header>.video>.description>.share>ul>li{width:25%;} 
#main>header>.video>.description>.share>ul>li>a{ display:block; width:30px; height:30px; border-radius:15px;} 
#main>header>.video>.description>.share>ul>li>a:hover{ background-color:#32ADC3;} 
#main>header>.video>.description>.share>ul>li>a>img{ margin-top:6px; text-align:center;}

修訂：我的問題是非常精確的，沒有人尚未解決的問題，所以我知道這是不是真的允許的，但如果你訪問www.mildenhire .com/bigsmile你會看到那裏的網站和視頻選項立即加載，是你看到的第一件事。我不知道爲什麼它可以在Mac和iOS上運行，但不能在PC上運行。有人可以訪問這個頁面，排除它並告訴我我做錯了什麼嗎？這是一個很大的學習曲線。由於

來源

2013-12-10 user3074956

我會嘗試的iframe嵌入，而不是：

<iframe width="640" height="360" src="//www.youtube.com/embed/krlR2-YGk4s?rel=0" frameborder="0" allowfullscreen></iframe>

來源

2013-12-10 14:51:10 Ryan

我會在哪裏放呢？ – user3074956

修正案：我的問題非常精確，沒有人解決這個問題，所以我知道這並不是真的允許，但是如果您訪問www.mildenhire.com/bigsmile，您將會看到該網站並立即加載視頻選項，並且是你看到的第一件事。我不知道爲什麼它可以在Mac和iOS上運行，但不能在PC上運行。有人可以訪問這個頁面，排除它並告訴我我做錯了什麼嗎？這是一個很大的學習曲線。謝謝 – user3074956

Youtube視頻彈出可在Mac和ios上使用，但不能在任何PC上使用

回答

相關問題