質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
HTML5

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

Q&A

解決済

1回答

5689閲覧

video.play() operaで動かない。

manabunbun

総合スコア39

HTML5

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

0グッド

0クリップ

投稿2018/07/13 07:26

videoタグの動画をクリックして、再生したりストップしたりさせています。

HTML5

1<section class="serisec"> 2 <div class="seri_container1"> 3 4 <video preload="none" src="/img/kaisya/SeriNO1.mp4" muted id="video" poster="/img/kaisya/serivideo1.jpg"> 5 <p>動画を再生するには、videoタグをサポートしたブラウザが必要です。</p> 6 </video> 7 </div> 8 </div> 9 </section> 10 11

Jquery

1// JavaScript Document 2$(function() { 3 //video要素の取得 4 var video=$("#video").get(0); 5 //videoボタンの取得 6 var video_btn=$("#video_btn").get(0); 7 //状態保存 8 var btn_status=0; 9 10 //画面クリックで再生・ポーズ 11 $("#video").on("click",function() { 12 13 if(btn_status===0) { 14 video.play(); 15 btn_status=1; 16 }else{ 17 video.pause(); 18 btn_status=0; 19 } 20 });

opera(ver54.0)以外のブラウザでは問題なく動くのですが、operaでは"Console"部分に以下のようなエラーが出ます。

Uncaught (in promise) DOMException: Failed to load because no supported source was found.
2,3回続けてクリックすると
"video.play()"の部分でに、
Uncaught (in promise) DOMException: The element has no supported sources.
と表示されます。

これはmp4がダウンロードされてきていないのに、クリックしているからでしょうか。
それともjqueryの記述の仕方が悪いのでしょうか。

ネットで調べましたが、英語のサイトばかりでよくわかりませんでした。
operaが悪いのでしょうか。
よろしくお願いします。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

ベストアンサー

Failed to load because no supported source was found.まずは翻訳してみましょうよ。

原因が分かったら違うファイルで試してみて下さい。MP4と言っても中身はいろんなコーデックを使っている可能が有りますよ。ファイル名からするとビデオカメラで撮ったファイルかな?
MP4 - Wikipedia

投稿2018/07/13 17:13

oikashinoa

総合スコア2826

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

manabunbun

2018/07/20 06:58 編集

oikashinoaご回答ありがとうございました。mp4へのパスが悪いのだろうと思い、"."をつけたり、"/"を削除したり,"http"から始まるフルパスに変えてみたりしたのですが、動きませんでした。 console.log(video)でvideo変数を表示させてみると、videoタグの内容が全て表示されていました。 社内でホームページを開発する環境を作成していますが、こちらはoperaでもvideoが動きます。 他にどこをチェックしたらよいでしょうか。 よろしくお願いします。
oikashinoa

2018/07/20 07:14 編集

1.パス opera以外なら再生できたんですよね? ではパスは正しいです。 2.mp4のファイル 今のmp4が原因なのか以下で切り分けして下さい。 operaで再生できるmp4なファイルをネットで探してダウンロード→既存の SeriNO1.mp4をバックアップ →ダウンロードしたものをSeriNO1.mp4にリネーム→同じパスに置く→再生できるか?
oikashinoa

2018/07/20 16:18

> 社内でホームページを開発する環境を作成していますが、こちらはoperaでもvideoが動きます。 上記 見落としてました。 状況がわからないのですが、 1.質問で書いている環境は社内ではないとしたら、どういう環境なのでしょうか? 2.社内で再生できたMP4を、質問で書いた環境に持って行ったら再生できますか?
manabunbun

2018/07/21 00:37

ご回答ありがとうございました。 >1.質問で書いている環境は社内ではないとしたら、どういう環境なのでしょうか? ここに設置しています。 http://kensui.on.arena.ne.jp/infomation/serivideo/ 社内環境は、kensui.on.arena.ne.jpの部分が、"172.16.16.117"となっています。自分でwebサーバー立ち上げています。 >2.社内で再生できたMP4を、質問で書いた環境に持って行ったら再生できますか? 出来ません。FTPソフト(FFFTP Ver 1.98g2)を使用して同じものをアップロードしています。 operaのバージョンは、 54.0.2952.60 です。 php+Smartyを使用して作成しているのですが、単純にhtmlファイルに <video autoplay preload="auto" controls src="/img/kaisya/SeriNO1.mp4"> </video> としてffftpでアップロードしてみましたが、videoコントロールは、表示されるのですが、ファイルが上下に破れた様な画像が表示され動画は、動きませんでした。 でも172.16.16.117に変更すると表示されます。 operaの問題なのでしょうか、それとも自分の設定がどこか悪いのでしょうか。 よろしくお願いします。
manabunbun

2018/07/23 00:02

http://mazwai.com/#/ こちらのサイトが無料で使用ができる様なのでダウンロードして、htmlのvideoタグに埋め込んでアップロードしてみましたが、 閲覧できませんでした。
oikashinoa

2018/07/23 01:13

> ffftpでアップロードしてみましたが、videoコントロールは、表示されるのですが、ファイルが上下に破れた様な画像が表示され動画は、動きませんでした。 ffftpについて。 1 バイナリーモードでmp4アップしてます? 2 アップしたmp4をダウンロードして、正しくアップロード出来ているか確認してください 状況が混み合ってきたので以下の観点で状況まとめして下さい。 縦軸 ブラウザ(pcかモバイルかでも分ける) 横軸 どこのサイトか。 複数のmp4で状況異なるなら、ファイル毎で表を作ってください。
manabunbun

2018/07/23 06:45

ご回答ありがとうございました。 ffftpについてですが、 >1 バイナリーモードでmp4アップしてます? バイナリーモードではなかったので、バイナリーモードに変更してアップしましたが、結果変わらず動きませんでした。 >2 アップしたmp4をダウンロードして、正しくアップロード出来ているか確認してください ダウンロードして、ダブルクリックで実行するとWindows10の持つ再生ソフトで再生されました。 >縦軸 ブラウザ(pcかモバイルかでも分ける) 調べた限りでは、PC(Win10)のoperaだけが動きません。 android上の"Opera Touch"は、うまく再生されます。 >横軸 どこのサイトか http://kensui.on.arena.ne.jp/infomation/serivideo/ ここです。 >複数のmp4で状況異なるなら、ファイル毎で表を作ってください。 状況は同じで、再生されません。 半ばあきらめておりますが、よろしくお願いします。
oikashinoa

2018/07/23 11:24

>>縦軸 ブラウザ(pcかモバイルかでも分ける) >調べた限りでは、PC(Win10)のoperaだけが動きません。 >android上の"Opera Touch"は、うまく再生されます。 ここだけ見るとPC(Win10)の問題なんですよねぇ。 https://windowsreport.com/opera-black-screen-bug/ ↑の Solution 4 – Disable Hardware Acceleration から Solution 8 – Reinstall Opera を試すぐらいかなぁ。それ以上は想像つきません。 クライアント側の問題だったら手が出しにくいし… 見もフタもないことを書くと、operaは諦めてもいいんじゃないのですか? 最初からoperaが記載有ったので環境の対象にしていたと思いますが。
manabunbun

2018/07/26 00:44

ご回答ありがとうございます。win7のoperaでも再生できませんでした。 operaのバグだと思って諦めます。ただ社内LAN環境だとうまく再生できるというのが、解せないですが諦めようと思います。 色々とありがとうございました。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問