2016-10-02 12 views
0

iframeを使ってYouTube動画をインポートしましたが、モバイルでは動作しませんが、デスクトップでは完全に動作します。働いていないことで触れたときにiframeビデオが再生されない

、私は意味:それがタッチされたときに動画の再生を開始しないと、それが二重に触れています場合、ページはズームイン

コード:

div#video 
    iframe(src = 'https://www.youtube.com/embed/mfB19N3ZdS0' frameborder = '0', allowfullscreen = '') 
+0

私の問題を解決し、あなたが鼻水作業をDOE、それによって何を意味するか説明できます - 何が起こっている正確に何? – Mick

+0

@Mickがうまくいかないというのは、ビデオをタッチすると再生が開始されず、ダブルタッチするとページがズームインするということです。 – Paul

答えて

1

更新

あなたが指定したウェブページのリンクを見ると、再生ボタンが当たらないという意味の動画をカバーしているDIVがあることが問題です。ブラウザが狭い場合にのみ発生します。そのため、携帯端末でしか閲覧できないのはなぜですか。それはまた、見つけるのが難しいサファリ特有のようです。

デベロッパーツールと接続されたiPhoneを使用しているiOSインスペクタ、ブラウザを1列幅に縮小したMacのSafariでidが "quotesRight"のdivを見ると、あなたはビデオがiOSデバイスの微細果たしているブラウザインスペクタで、このdiv要素を削除した場合

enter image description here

:あなたが再生ボタンを打つことができないので、div要素は、動画の上になります。

私は最初に見たときに間違いなく問題だったため、元の回答をそのまま残しておきます。誰かを助けるかもしれません - 今は中小企業のコンテンツには間違いがありませんSMEビデオ。たぶん、これは著作権侵害のチェックで偽陽性であったのかもしれません。

また、下の例のHTMLは、ブラウザ間で確実に動作するため、確認するのに便利です(私が見る限り)。 HTMLの構文が正しいと仮定すると、

オリジナル答え

(私は上記のあなたの抽出物が速記だと思う?)、私は、問題が特定のデバイスに制限されているように見える、使用している特定のビデオでかもしれないと思いますコンテンツ所有者(この場合はSME)によってあなたがMac上でChromeでそれを再生しようとした場合、直接あなたがこのメッセージを取得例えば

enter image description here

W3Schoolsのからの簡単な例を使用して、iPhone上であなたのビデオを再生することは、正確に振る舞い、あなたを与えます説明する。

さまざまなサンプル動画(私はGoogleのYouTubeの例を試しました)を使用して、うまく再生します。ここで

は、YouTubeの例のビデオのサンプルコードです:iframedisplay: blockを追加

<!DOCTYPE html> 
<html> 
<head> 
<title>Page Title</title> 
</head> 
<body> 

<h1>This is a Heading</h1> 
<p>This is a paragraph.</p> 

<iframe id="player" type="text/html" width="640" height="390" 
    src="http://www.youtube.com/embed/M7lc1UVf-VE?enablejsapi=1&origin=http://example.com" 
    frameborder="0"></iframe> 

</body> 
</html> 
+0

私のコードは「翡翠コード」です。私は 'share'を選択した後、' Google'が私に与えたコードを使用しています。