ui.igVideoPlayer
VideoPlayer は、HTML 5 ビデオ を表示する jQuery UI ウィジェットで、どのブラウザーでも UI の一貫性を確保し、フルセットのプレーヤー コントロールをエンドユーザーに提供するものです。この API のクラス、オプション、イベント、メソッド、およびテーマの詳細については、上記の各関連タブをご覧ください。
次のサンプル コードは、igVideoPlayer コントロールの初期方法を示すものです。
この API を使用した作業方法の詳細についてはここをクリックしてください。igVideoPlayer コントロールの必要なスクリプトおよびテーマを参照する方法については、 「Ignite UI で JavaScript リソースを使用する」および Ignite UI のスタイル設定とテーマを参照してください。コード サンプル
<!doctype html> <html> <head> <!-- Infragistics Combined CSS --> <link href="css/themes/infragistics/infragistics.theme.css" rel="stylesheet" type="text/css" /> <link href="css/structure/infragistics.css" rel="stylesheet" type="text/css" /> <!-- jQuery Core --> <script src="js/jquery.js" type="text/javascript"></script> <!-- jQuery UI --> <script src="js/jquery-ui.js" type="text/javascript"></script> <!-- Infragistics Combined Scripts --> <script src="js/infragistics.core.js" type="text/javascript"></script> <script src="js/infragistics.lob.js" type="text/javascript"></script> <script type="text/javascript"> $(function () { $("#videoPlayer").igVideoPlayer({ height: "300px", width: "400px", title: "Sample", sources: ["http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/Infragistics_Presentation_lowRes_1.h264.mp4", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/Infragistics_Presentation_lowRes_1.webmvp8.webm", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/Infragistics_Presentation_lowRes_1.theora.ogv" ] }); }); </script> </head> <body> <div id="videoPlayer"></div> </body> </html>
関連サンプル
関連トピック
依存関係
-
autohide
- タイプ:
- bool
- デフォルト:
- true
ビデオの上でマウスをホバーしていないときに、プレーヤー コントロールを自動的に隠すかどうかを取得または設定します。Infragistics 再生コントロールを使用する場合のみの設定です。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ autohide:true }); //Get var hide = $(".selector").igVideoPlayer("option", "autohide"); //Set $(".selector").igVideoPlayer("option", "autohide", true);
-
autoplay
- タイプ:
- bool
- デフォルト:
- false
コントロールを読み込んだ後にビデオをすぐに再生するかどうかを取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ autoplay:true }); //Get var autoPlay = $(".selector").igVideoPlayer("option", "autoplay"); //Set $(".selector").igVideoPlayer("option", "autoplay", true);
-
banners
- タイプ:
- array
- デフォルト:
- []
- 要素タイプ:
- object
ビデオ クリップが再生されるときにバナーを表示するバナー オブジェクトの配列を取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ banners: [{ imageUrl: "http://www.igniteui.com/images/samples/video-player/quince-intro-1.png", link: "http://quince.infragistics.com/", times: [5, 20, 60], visible: false, closeBanner: true, animate: true, autohide: true, hidedelay: 10000, width: "200px", height: "67px" }] }); //Get var banners = $(".selector").igVideoPlayer("option", "banners"); //Set var banners = [{ imageUrl: 'http://www.igniteui.com/images/samples/video-player/quince-intro-1.png', link: 'http://quince.infragistics.com/', times: [5, 20, 60], visible: false, closeBanner: true, animate: true, autohide: true, hidedelay: 10000, width: "200px", height: "67px" }]; $(".selector").igVideoPlayer("option", "banners", banners);
-
animate
- タイプ:
- bool
- デフォルト:
- true
バナーを表示/非表示するときにアニメーション結果を適用するかどうかを取得または設定します。true に設定する場合、アニメーションは banner.duration (ミリ秒) を再生します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ banners: [{ imageUrl: "http://www.igniteui.com/images/samples/video-player/quince-intro-1.png", link: "http://quince.infragistics.com/", times: [5, 20, 60], visible: false, closeBanner: true, animate: true, autohide: true, hidedelay: 10000, width: "200px", height: "67px" }] }); //Get var banners = $(".selector").igVideoPlayer("option", "banners"); var animate = banners[0].animate; //Set var banners = $(".selector").igVideoPlayer("option", "banners"); banners[0].animate = true;
-
autohide
- タイプ:
- bool
- デフォルト:
- false
バナーを自動的に非表示するかどうかを取得または設定します。true に設定する場合、バナーは hidedelay (ミリ秒) の後に非表示されます。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ banners: [{ imageUrl: "http://www.igniteui.com/images/samples/video-player/quince-intro-1.png", link: "http://quince.infragistics.com/", times: [5, 20, 60], visible: false, closeBanner: true, animate: true, autohide: true, hidedelay: 10000, width: "200px", height: "67px" }] }); //Get var banners = $(".selector").igVideoPlayer("option", "banners"); var autohide = banners[0].autohide; //Set var banners = $(".selector").igVideoPlayer("option", "banners"); banners[0].autohide = true;
-
closeBanner
- タイプ:
- bool
- デフォルト:
- true
ユーザーがバナーを閉じることができるかどうかを取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ banners: [{ imageUrl: "http://www.igniteui.com/images/samples/video-player/quince-intro-1.png", link: "http://quince.infragistics.com/", times: [5, 20, 60], visible: false, closeBanner: true, animate: true, autohide: true, hidedelay: 10000, width: "200px", height: "67px" }] }); //Get var banners = $(".selector").igVideoPlayer("option", "banners"); var closeBanner = banners[0].closeBanner; //Set var banners = $(".selector").igVideoPlayer("option", "banners"); banners[0].closeBanner = true;
-
css
- タイプ:
- string
- デフォルト:
- null
バナー グリッドに適用するバナー固有の css クラスを取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ banners: [{ imageUrl: "http://www.igniteui.com/images/samples/video-player/quince-intro-1.png", link: "http://quince.infragistics.com/", times: [5, 20, 60], visible: false, closeBanner: true, animate: true, autohide: true, hidedelay: 10000, width: "200px", height: "67px", css: "bannerCss" }] }); //Get var banners = $(".selector").igVideoPlayer("option", "banners"); var css = banners[0].css; //Set var banners = $(".selector").igVideoPlayer("option", "banners"); banners[0].css = "bannerCss";
-
duration
- タイプ:
- number
- デフォルト:
- 1000
バナー アニメーション期間を取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ banners: [{ imageUrl: "http://www.igniteui.com/images/samples/video-player/quince-intro-1.png", link: "http://quince.infragistics.com/", times: [5, 20, 60], visible: false, closeBanner: true, animate: true, autohide: true, duration: 2000, hidedelay: 10000, width: "200px", height: "67px" }] }); //Get var banners = $(".selector").igVideoPlayer("option", "banners"); var duration = banners[0].duration; //Set var banners = $(".selector").igVideoPlayer("option", "banners"); banners[0].duration = 2000;
-
height
- タイプ:
- enumeration
- デフォルト:
- null
コード サンプル
//Initialize $(".selector").igVideoPlayer({ banners: [{ imageUrl: "http://www.igniteui.com/images/samples/video-player/quince-intro-1.png", link: "http://quince.infragistics.com/", times: [5, 20, 60], visible: false, closeBanner: true, animate: true, autohide: true, hidedelay: 10000, width: "200px", height: "67px" }] }); //Get var banners = $(".selector").igVideoPlayer("option", "banners"); var height = banners[0].height; //Set var banners = $(".selector").igVideoPlayer("option", "banners"); banners[0].height = "67px";
-
hidedelay
- タイプ:
- number
- デフォルト:
- 10000
バナーの autohide 遅延時間をミリ秒で取得または設定します。banner.autohide オプションが True に設定される場合のみに考慮されます。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ banners: [{ imageUrl: "http://www.igniteui.com/images/samples/video-player/quince-intro-1.png", link: "http://quince.infragistics.com/", times: [5, 20, 60], visible: false, closeBanner: true, animate: true, autohide: true, hidedelay: 10000, width: "200px", height: "67px" }] }); //Get var banners = $(".selector").igVideoPlayer("option", "banners"); var hidedelay = banners[0].hidedelay; //Set var banners = $(".selector").igVideoPlayer("option", "banners"); banners[0].hidedelay = 10000;
-
imageUrl
- タイプ:
- string
- デフォルト:
- ""
バナー画像の URL を取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ banners: [{ imageUrl: "http://www.igniteui.com/images/samples/video-player/quince-intro-1.png", link: "http://quince.infragistics.com/", times: [5, 20, 60], visible: false, closeBanner: true, animate: true, autohide: true, hidedelay: 10000, width: "200px", height: "67px" }] }); //Get var banners = $(".selector").igVideoPlayer("option", "banners"); var imageUrl = banners[0].imageUrl; //Set var banners = $(".selector").igVideoPlayer("option", "banners"); banners[0].imageUrl = "http://www.igniteui.com/images/samples/video-player/quince-intro-1.png";
-
link
- タイプ:
- string
- デフォルト:
- null
新しいウィンドウに開くバナー リンクを取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ banners: [{ imageUrl: "http://www.igniteui.com/images/samples/video-player/quince-intro-1.png", link: "http://quince.infragistics.com/", times: [5, 20, 60], visible: false, closeBanner: true, animate: true, autohide: true, hidedelay: 10000, width: "200px", height: "67px" }] }); //Get var banners = $(".selector").igVideoPlayer("option", "banners"); var link = banners[0].link; //Set var banners = $(".selector").igVideoPlayer("option", "banners"); banners[0].link = "http://quince.infragistics.com/";
-
times
- タイプ:
- array
- デフォルト:
- []
- 要素タイプ:
- object
数値の配列を取得または設定します。それぞれの数は、ムービーにバナーがポップする秒を指定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ banners: [{ imageUrl: "http://www.igniteui.com/images/samples/video-player/quince-intro-1.png", link: "http://quince.infragistics.com/", times: [5, 20, 60], visible: false, closeBanner: true, animate: true, autohide: true, hidedelay: 10000, width: "200px", height: "67px" }] }); //Get var banners = $(".selector").igVideoPlayer("option", "banners"); var times = banners[0].times; //Set var banners = $(".selector").igVideoPlayer("option", "banners"); banners[0].times = [5, 20, 60];
-
visible
- タイプ:
- bool
- デフォルト:
- true
バナーが表示されるかどうかを取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ banners: [{ imageUrl: "http://www.igniteui.com/images/samples/video-player/quince-intro-1.png", link: "http://quince.infragistics.com/", times: [5, 20, 60], visible: false, closeBanner: true, animate: true, autohide: true, hidedelay: 10000, width: "200px", height: "67px" }] }); //Get var banners = $(".selector").igVideoPlayer("option", "banners"); var visible = banners[0].visible; //Set var banners = $(".selector").igVideoPlayer("option", "banners"); banners[0].visible = false;
-
width
- タイプ:
- enumeration
- デフォルト:
- null
コード サンプル
//Initialize $(".selector").igVideoPlayer({ banners: [{ imageUrl: "http://www.igniteui.com/images/samples/video-player/quince-intro-1.png", link: "http://quince.infragistics.com/", times: [5, 20, 60], visible: false, closeBanner: true, animate: true, autohide: true, hidedelay: 10000, width: "200px", height: "67px" }] }); //Get var banners = $(".selector").igVideoPlayer("option", "banners"); var width = banners[0].width; //Set var banners = $(".selector").igVideoPlayer("option", "banners"); banners[0].width = "200px";
-
bookmarks
- タイプ:
- array
- デフォルト:
- []
- 要素タイプ:
- object
ビデオ プレーヤー コントロールに表示されるブックマークの配列を取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ bookmarks: [ { title: "Design", time: 14 }, { title: "Develop", time: 46 }, { title: "Experience", time: 74 } ] }); //Get var bookmarks = $(".selector").igVideoPlayer("option", "bookmarks"); //Set $(".selector").igVideoPlayer("option", "bookmarks", [{title: "Experience", time: 74 }]);
-
disabled
- タイプ:
- bool
- デフォルト:
- false
ブックマークが無効かどうかを取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ bookmarks: [ { title: "Experience", time: 74, disabled: true } ] }); //Get var bookmarks = $(".selector").igVideoPlayer("option", "bookmarks"); var disabled = bookmarks[0].disabled; //Set var bookmarks = $(".selector").igVideoPlayer("option", "bookmarks"); bookmarks[0].disabled = false;
-
time
- タイプ:
- number
- デフォルト:
- 0
ブックマークの位置を取得または設定します。0 とムービーの期間 (秒単位) の間にある必要があります。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ bookmarks: [ { title: "Experience", time: 74 } ] }); //Get var bookmarks = $(".selector").igVideoPlayer("option", "bookmarks"); var time = bookmarks[0].time; //Set var bookmarks = $(".selector").igVideoPlayer("option", "bookmarks"); bookmarks[0].time = 12;
-
title
- タイプ:
- string
- デフォルト:
- ""
ブックマークのタイトルを取得または設定します。ホバーするとツールチップとして表示されます。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ bookmarks: [ { title: "Experience", time: 74 } ] }); //Get var bookmarks = $(".selector").igVideoPlayer("option", "bookmarks"); var title = bookmarks[0].title; //Set var bookmarks = $(".selector").igVideoPlayer("option", "bookmarks"); bookmarks[0].title = "Infragistics Experience";
-
browserControls
- タイプ:
- bool
- デフォルト:
- false
組み込みブラウザー コントロールを使用するかどうかを取得または設定します。デフォルトで、プレーヤーは Infragistics の再生コントロールを使用します。ただし、組み込みブラウザー コントロールを使用する場合、ブラウザーによってルック アンド フィールが異なることがあります。 このオプションが true に設定された場合、commercials がサポートされていないため、表示されません。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ browserControls: true }); //Get var controls = $(".selector").igVideoPlayer("option", "browserControls"); //Set $(".selector").igVideoPlayer("option", "browserControls", true);
-
centerButtonHideDelay
- タイプ:
- number
- デフォルト:
- 1200
大きなボタンを非表示にするまでの遅延時間を取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ centerButtonHideDelay:2400 }); //Get var delay = $(".selector").igVideoPlayer("option", "centerButtonHideDelay"); //Set $(".selector").igVideoPlayer("option", "centerButtonHideDelay", 2400);
-
commercials
- タイプ:
- object
- デフォルト:
- {}
ビデオが再生しているときに表示されるコマーシャル オブジェクトの配列を取得または設定します。 broswerControls がコマーシャルをサポートしないことに注意してください。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ commercials: { linkedCommercials: [ { sources: [ "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.h264.mp4", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.webmvp8.webm", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.theora.ogv" ], startTime: 20, title: "Quince Presentation p1", link: "http://quince.infragistics.com/" }, { sources: [ "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.h264.mp4", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.webmvp8.webm", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.theora.ogv" ], startTime: 100, title: "Quince Presentation p3", link: "http://quince.infragistics.com/" }] } }); //Get var commercials = $(".selector").igVideoPlayer("option", "commercials"); //Set var commercials = { linkedCommercials: [ { sources: [ "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.h264.mp4", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.webmvp8.webm", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.theora.ogv" ], startTime: 20, title: 'Quince<br/>Presentation<br/>p1', link: 'http://quince.infragistics.com/' }], adMessage: { hideDelay: 3000 } }; $(".selector").igVideoPlayer("option", "commercials", commercials);
-
adMessage
- タイプ:
- object
- デフォルト:
- {}
コマーシャルの広告メッセージの設定をカスタマイズします。広告メッセージはコマーシャルの期間を表示し、コマーシャルの再生が開始したときに表示されます。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ commercials: { linkedCommercials: [ { sources: [ "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.h264.mp4", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.webmvp8.webm", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.theora.ogv" ], startTime: 20, title: "Quince Presentation p1", link: "http://quince.infragistics.com/" }, { sources: [ "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.h264.mp4", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.webmvp8.webm", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.theora.ogv" ], startTime: 100, title: "Quince Presentation p3", link: "http://quince.infragistics.com/" }], adMessage: { animate: true, animationDuration: 1000, autoHide: true, hideDelay: 5000 } } }); //Get var commercials = $(".selector").igVideoPlayer("option", "commercials"); var adMessage = commercials.adMessage; //Set var commercials = $(".selector").igVideoPlayer("option", "commercials"); var adMessage = { animate: true, animationDuration: 1000, autoHide: true, hideDelay: 5000 }; commercials.adMessage = adMessage;
-
animate
- タイプ:
- bool
- デフォルト:
- true
広告メッセージを表示/非表示するときにアニメーション結果を適用するかどうかを取得または設定します。true に設定する場合、アニメーションは animationDuration (ミリ秒) を再生します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ commercials: { linkedCommercials: [ { sources: [ "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.h264.mp4", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.webmvp8.webm", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.theora.ogv" ], startTime: 20, title: "Quince Presentation p1", link: "http://quince.infragistics.com/" }, { sources: [ "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.h264.mp4", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.webmvp8.webm", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.theora.ogv" ], startTime: 100, title: "Quince Presentation p3", link: "http://quince.infragistics.com/" }], adMessage: { animate: true, animationDuration: 1000, autoHide: true, hideDelay: 5000 } } }); //Get var commercials = $(".selector").igVideoPlayer("option", "commercials"); var animate = commercials.adMessage.animate; //Set var commercials = $(".selector").igVideoPlayer("option", "commercials"); commercials.adMessage.animate = false;
-
animationDuration
- タイプ:
- number
- デフォルト:
- 1000
コマーシャルの広告メッセージのアニメーション期間を取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ commercials: { linkedCommercials: [ { sources: [ "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.h264.mp4", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.webmvp8.webm", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.theora.ogv" ], startTime: 20, title: "Quince Presentation p1", link: "http://quince.infragistics.com/" }, { sources: [ "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.h264.mp4", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.webmvp8.webm", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.theora.ogv" ], startTime: 100, title: "Quince Presentation p3", link: "http://quince.infragistics.com/" }], adMessage: { animationDuration: 2000 } } }); //Get var commercials = $(".selector").igVideoPlayer("option", "commercials"); var animationDuration = commercials.adMessage.animationDuration; //Set var commercials = $(".selector").igVideoPlayer("option", "commercials"); commercials.adMessage.animationDuration = 1000;
-
autoHide
- タイプ:
- bool
- デフォルト:
- true
コマーシャルの広告メッセージの自動非表示を取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ commercials: { linkedCommercials: [ { sources: [ "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.h264.mp4", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.webmvp8.webm", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.theora.ogv" ], startTime: 20, title: "Quince Presentation p1", link: "http://quince.infragistics.com/" }, { sources: [ "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.h264.mp4", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.webmvp8.webm", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.theora.ogv" ], startTime: 100, title: "Quince Presentation p3", link: "http://quince.infragistics.com/" }], adMessage: { autoHide: false } } }); //Get var commercials = $(".selector").igVideoPlayer("option", "commercials"); var autoHide = commercials.adMessage.autoHide; //Set var commercials = $(".selector").igVideoPlayer("option", "commercials"); commercials.adMessage.autoHide = true;
-
hideDelay
- タイプ:
- number
- デフォルト:
- 20000
広告メッセージの非表示遅延時間を取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ commercials: { linkedCommercials: [ { sources: [ "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.h264.mp4", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.webmvp8.webm", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.theora.ogv" ], startTime: 20, title: "Quince Presentation p1", link: "http://quince.infragistics.com/" }, { sources: [ "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.h264.mp4", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.webmvp8.webm", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.theora.ogv" ], startTime: 100, title: "Quince Presentation p3", link: "http://quince.infragistics.com/" }], adMessage: { hideDelay: 5000 } } }); //Get var commercials = $(".selector").igVideoPlayer("option", "commercials"); var hideDelay = commercials.adMessage.hideDelay; //Set var commercials = $(".selector").igVideoPlayer("option", "commercials"); commercials.adMessage.hideDelay = 4000;
-
alwaysPlayCommercials
- タイプ:
- bool
- デフォルト:
- false
繰り返しの再生でコマーシャルを再生するかどうかを取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ commercials: { alwaysPlayCommercials: true } }); //Get var commercials = $(".selector").igVideoPlayer("option", "commercials"); var alwaysPlayCommercials = commercials.alwaysPlayCommercials; //Set var commercials = $(".selector").igVideoPlayer("option", "commercials"); commercials.alwaysPlayCommercials = true;
-
embeddedCommercials
- タイプ:
- array
- デフォルト:
- []
- 要素タイプ:
- object
埋め込んだコマーシャル オブジェクトの配列を取得または設定します。組み込みコマーシャルは、元のビデオファイルに含まれる広告です。ビデオのいくつかのセクションをコマーシャルとしてマークする場合に適しています。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ commercials: { embeddedCommercials: [ { sources: [ "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.h264.mp4", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.webmvp8.webm", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.theora.ogv" ], startTime: 20, endTime: 30, title: "Quince Presentation p1", link: "http://quince.infragistics.com/" }] } }); //Get var commercials = $(".selector").igVideoPlayer("option", "commercials"); var embeddedCommercials = commercials.embeddedCommercials; //Set var commercials = $(".selector").igVideoPlayer("option", "commercials"); var embeddedCommercials = [ { sources: [ "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.h264.mp4", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.webmvp8.webm", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.theora.ogv" ], startTime: 20, endTime: 30, title: "Quince Presentation p1", link: "http://quince.infragistics.com/" } ]; commercials.embeddedCommercials = embeddedCommercials;
-
endTime
- タイプ:
- number
- デフォルト:
- 30
埋め込んだコマーシャルの終了秒数を取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ commercials: { embeddedCommercials: [ { sources: [ "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.h264.mp4", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.webmvp8.webm", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.theora.ogv" ], startTime: 20, endTime: 30, title: "Quince Presentation p1", link: "http://quince.infragistics.com/" }] } }); //Get var commercials = $(".selector").igVideoPlayer("option", "commercials"); var endTime = commercials.embeddedCommercials[0].endTime; //Set var commercials = $(".selector").igVideoPlayer("option", "commercials"); commercials.embeddedCommercials[0].endTime = 30;
-
link
- タイプ:
- string
- デフォルト:
- ""
埋め込んだコマーシャルのスポンサーされたリンクを取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ commercials: { embeddedCommercials: [ { sources: [ "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.h264.mp4", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.webmvp8.webm", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.theora.ogv" ], startTime: 20, title: "Quince Presentation p1", link: "http://quince.infragistics.com/" }] } }); //Get var commercials = $(".selector").igVideoPlayer("option", "commercials"); var link = commercials.embeddedCommercials[0].link; //Set var commercials = $(".selector").igVideoPlayer("option", "commercials"); commercials.embeddedCommercials[0].link = "http://quince.infragistics.com/";
-
startTime
- タイプ:
- number
- デフォルト:
- 20
埋め込んだコマーシャルの開始秒数を取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ commercials: { embeddedCommercials: [ { sources: [ "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.h264.mp4", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.webmvp8.webm", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.theora.ogv" ], startTime: 20, title: "Quince Presentation p1", link: "http://quince.infragistics.com/" }] } }); //Get var commercials = $(".selector").igVideoPlayer("option", "commercials"); var startTime = commercials.embeddedCommercials[0].startTime; //Set var commercials = $(".selector").igVideoPlayer("option", "commercials"); commercials.embeddedCommercials[0].startTime = 20;
-
title
- タイプ:
- string
- デフォルト:
- ""
埋め込んだコマーシャルのブックマークのツールチップを取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ commercials: { embeddedCommercials: [ { sources: [ "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.h264.mp4", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.webmvp8.webm", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.theora.ogv" ], startTime: 20, title: "Quince Presentation p1", link: "http://quince.infragistics.com/" }] } }); //Get var commercials = $(".selector").igVideoPlayer("option", "commercials"); var title = commercials.embeddedCommercials[0].title; //Set var commercials = $(".selector").igVideoPlayer("option", "commercials"); commercials.embeddedCommercials[0].title = "Quince Presentation p1";
-
linkedCommercials
- タイプ:
- array
- デフォルト:
- []
- 要素タイプ:
- object
リンクされたコマーシャル オブジェクトの配列を取得または設定します。リンク コマーシャルは、startTime プロパティのムービー クリップの指定した場所で再生されるコマーシャル ビデオ ファイルです。この機能は、コマーシャル ソース以外を頻繁に変更する場合に便利な機能です。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ commercials: { linkedCommercials: [ { sources: [ "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.h264.mp4", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.webmvp8.webm", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.theora.ogv" ], startTime: 20, title: "Quince Presentation p1", link: "http://quince.infragistics.com/" }, { sources: [ "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.h264.mp4", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.webmvp8.webm", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.theora.ogv" ], startTime: 100, title: "Quince Presentation p3", link: "http://quince.infragistics.com/" }] } }); //Get var commercials = $(".selector").igVideoPlayer("option", "commercials"); var linkedCommercials = commercials.linkedCommercials; //Set var commercials = $(".selector").igVideoPlayer("option", "commercials"); var linkedCommercials = [ { sources: [ "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.h264.mp4", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.webmvp8.webm", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.theora.ogv" ], startTime: 100, title: "Quince Presentation p3", link: "http://quince.infragistics.com/" } ]; commercials.linkedCommercials = linkedCommercials;
-
link
- タイプ:
- string
- デフォルト:
- ""
リンクされたコマーシャルをクリックしたときに開くリンクを取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ commercials: { linkedCommercials: [ { sources: [ "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.h264.mp4", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.webmvp8.webm", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.theora.ogv" ], startTime: 20, title: "Quince Presentation p1", link: "http://quince.infragistics.com/" }] } }); //Get var commercials = $(".selector").igVideoPlayer("option", "commercials"); var link = commercials.linkedCommercials[0].link; //Set var commercials = $(".selector").igVideoPlayer("option", "commercials"); commercials.linkedCommercials[0].link = "http://quince.infragistics.com/";
-
sources
- タイプ:
- array
- デフォルト:
- []
- 要素タイプ:
- object
リンクされたコマーシャル ビデオのソースを取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ commercials: { linkedCommercials: [ { sources: [ "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.h264.mp4", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.webmvp8.webm", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.theora.ogv" ], startTime: 20, title: "Quince Presentation p1", link: "http://quince.infragistics.com/" }] } }); //Get var commercials = $(".selector").igVideoPlayer("option", "commercials"); var sources = commercials.linkedCommercials[0].sources; //Set var commercials = $(".selector").igVideoPlayer("option", "commercials"); commercials.linkedCommercials[0].sources = ["http://quince.infragistics.com/"];
-
startTime
- タイプ:
- number
- デフォルト:
- 10
リンクされたビデオ内でコマーシャルを再生する必要がある秒を取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ commercials: { linkedCommercials: [ { sources: [ "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.h264.mp4", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.webmvp8.webm", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.theora.ogv" ], startTime: 20, title: "Quince Presentation p1", link: "http://quince.infragistics.com/" }] } }); //Get var commercials = $(".selector").igVideoPlayer("option", "commercials"); var startTime = commercials.linkedCommercials[0].startTime; //Set var commercials = $(".selector").igVideoPlayer("option", "commercials"); commercials.linkedCommercials[0].startTime = 20;
-
title
- タイプ:
- string
- デフォルト:
- ""
リンクされたコマーシャル ブックマークのツールチップを取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ commercials: { linkedCommercials: [ { sources: [ "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.h264.mp4", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.webmvp8.webm", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.theora.ogv" ], startTime: 20, title: "Quince Presentation p1", link: "http://quince.infragistics.com/" }] } }); //Get var commercials = $(".selector").igVideoPlayer("option", "commercials"); var title = commercials.linkedCommercials[0].title; //Set var commercials = $(".selector").igVideoPlayer("option", "commercials"); commercials.linkedCommercials[0].title = "Quince Presentation p1";
-
showBookmarks
- タイプ:
- bool
- デフォルト:
- true
コマーシャルの場所を表示するかどうかを取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ commercials: { showBookmarks: false } }); //Get var commercials = $(".selector").igVideoPlayer("option", "commercials"); var showBookmarks = commercials.linkedCommercials.showBookmarks; //Set var commercials = $(".selector").igVideoPlayer("option", "commercials"); commercials.linkedCommercials.showBookmarks = false;
-
fullscreen
- タイプ:
- bool
- デフォルト:
- false
ビデオ プレーヤーを全画面表示にするかどうかを取得または設定します。これは純粋な全画面表示ではありません。ブラウザーがそれを許可しないためです。コントロールの幅と高さを 100% に設定するだけです。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ fullscreen:true }); //Get var fullScreen = $(".selector").igVideoPlayer("option", "fullscreen"); //Set $(".selector").igVideoPlayer("option", "fullscreen", true);
-
height
- タイプ:
- enumeration
- デフォルト:
- null
コントロールの高さを取得または設定します。null の場合、他の高さが定義されていない場合 (デフォルト)、データがフィットするよう伸縮します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ width: 600, height: 400 }); //Get var height = $(".selector").igVideoPlayer("option", "height"); //Set $(".selector").igVideoPlayer("option", "height", 450);
-
language
継承- タイプ:
- string
- デフォルト:
- "en"
ウィジェットのロケール言語設定を取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ language: "ja" }); // Get var language = $(".selector").igVideoPlayer("option", "language"); // Set $(".selector").igVideoPlayer("option", "language", "ja");
-
locale
- タイプ:
- object
- デフォルト:
- {}
-
adMessage
- タイプ:
- bool
- デフォルト:
- ""
広告メッセージ テキストを取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ locale: { adMessage: 'Ad: Video will resume in $duration$ seconds.' } }); //Get var text = $(".selector").igVideoPlayer("option", "locale").adMessage; //Set $(".selector").igVideoPlayer("option", "locale", { buffering: 'Ad: Video will resume in $duration$ seconds.'});
-
adMessageLong
- タイプ:
- bool
- デフォルト:
- ""
長い広告メッセージ テキストを取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ locale: { adMessageLong: 'Ad: Video will resume in $duration$.' } }); //Get var text = $(".selector").igVideoPlayer("option", "locale").adMessageLong; //Set $(".selector").igVideoPlayer("option", "locale", { adMessageLong: 'Ad: Video will resume in $duration$.'});
-
adMessageNoDuration
- タイプ:
- bool
- デフォルト:
- ""
期間が指定されていない場合、メッセージ テキストを取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ locale: { adMessageNoDuration: 'Ad: Video will resume after the commercial.' } }); //Get var text = $(".selector").igVideoPlayer("option", "locale").adMessageNoDuration; //Set $(".selector").igVideoPlayer("option", "locale", { adMessageNoDuration: 'Ad: Video will resume after the commercial.'});
-
adNewWindowTip
- タイプ:
- bool
- デフォルト:
- ""
新しい広告ウィンドウ タイトルを取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ locale: { adNewWindowTip: 'Ad: Click to open ad content in a new window.' } }); //Get var text = $(".selector").igVideoPlayer("option", "locale").adNewWindowTip; //Set $(".selector").igVideoPlayer("option", "locale", { adNewWindowTip: 'Ad: Click to open ad content in a new window.'});
-
buffering
- タイプ:
- bool
- デフォルト:
- ""
バッファー ラベル テキストを取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ locale: { buffering: "Buffering" } }); //Get var text = $(".selector").igVideoPlayer("option", "locale").buffering; //Set $(".selector").igVideoPlayer("option", "locale", { buffering: "Buffering"});
-
enterFullscreen
- タイプ:
- bool
- デフォルト:
- ""
全画面表示ボタンのタイトルを取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ locale: { enterFullscreen: "Go Fullscreen" } }); //Get var text = $(".selector").igVideoPlayer("option", "locale").enterFullscreen; //Set $(".selector").igVideoPlayer("option", "locale", { enterFullscreen: "Go Fullscreen"});
-
exitFullscreen
- タイプ:
- bool
- デフォルト:
- ""
全画面表示ボタンのタイトルを取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ locale: { exitFullscreen: "Exit Fullscreen" } }); //Get var text = $(".selector").igVideoPlayer("option", "locale").exitFullscreen; //Set $(".selector").igVideoPlayer("option", "locale", { exitFullscreen: "Exit Fullscreen"});
-
live
- タイプ:
- bool
- デフォルト:
- ""
ライブ ビデオ タイトルを取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ locale: { live: "Live" } }); //Get var text = $(".selector").igVideoPlayer("option", "locale").live; //Set $(".selector").igVideoPlayer("option", "locale", { live: "Live" });
-
liveStream
- タイプ:
- bool
- デフォルト:
- ""
ライブ ストリーム ビデオ タイトルを取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ locale: { liveStream: "Live video" } }); //Get var text = $(".selector").igVideoPlayer("option", "locale").liveStream; //Set $(".selector").igVideoPlayer("option", "locale", { liveStream: "Live video" });
-
paused
- タイプ:
- bool
- デフォルト:
- ""
一時的ボタンのタイトルを取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ locale: { paused: "Paused" } }); //Get var text = $(".selector").igVideoPlayer("option", "locale").paused; //Set $(".selector").igVideoPlayer("option", "locale", { paused: "Paused" });
-
play
- タイプ:
- bool
- デフォルト:
- ""
再生ボタンのタイトルを取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ locale: { play: "Play" } }); //Get var text = $(".selector").igVideoPlayer("option", "locale").play; //Set $(".selector").igVideoPlayer("option", "locale", { play: "Playing" });
-
playing
- タイプ:
- bool
- デフォルト:
- ""
再生ボタンのタイトルを取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ locale: { playing: "Playing" } }); //Get var text = $(".selector").igVideoPlayer("option", "locale").playing; //Set $(".selector").igVideoPlayer("option", "locale", { playing: "Playing" });
-
progressLabelLongFormat
- タイプ:
- bool
- デフォルト:
- ""
進行状況ラベルの長い形式を取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ locale: { progressLabelLongFormat: "$currentTime$ / $duration$" } }); //Get var text = $(".selector").igVideoPlayer("option", "locale").progressLabelLongFormat; //Set $(".selector").igVideoPlayer("option", "locale", { progressLabelLongFormat: "$currentTime$ / $duration$" });
-
progressLabelShortFormat
- タイプ:
- bool
- デフォルト:
- ""
進行状況ラベルの短い形式を取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ locale: { progressLabelShortFormat: "$currentTime$" } }); //Get var text = $(".selector").igVideoPlayer("option", "locale").progressLabelShortFormat; //Set $(".selector").igVideoPlayer("option", "locale", { progressLabelShortFormat: "$currentTime$" });
-
relatedVideos
- タイプ:
- bool
- デフォルト:
- ""
関連するビデオ テキストを取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ locale: { relatedVideos: 'RELATED VIDEOS' } }); //Get var text = $(".selector").igVideoPlayer("option", "locale").relatedVideos; //Set $(".selector").igVideoPlayer("option", "locale", { relatedVideos: 'RELATED VIDEOS'});
-
replayButton
- タイプ:
- bool
- デフォルト:
- ""
再生ボタン テキストを取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ locale: { replayButton: 'Replay' } }); //Get var text = $(".selector").igVideoPlayer("option", "locale").replayButton; //Set $(".selector").igVideoPlayer("option", "locale", { replayButton: 'Replay'});
-
replayTooltip
- タイプ:
- bool
- デフォルト:
- ""
再生ボタン ツールチップを取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ locale: { replayTooltip: 'Replay' } }); //Get var text = $(".selector").igVideoPlayer("option", "locale").replayTooltip; //Set $(".selector").igVideoPlayer("option", "locale", { replayTooltip: 'Replay'});
-
skipTo
- タイプ:
- bool
- デフォルト:
- ""
スキップ ボタンのタイトルを取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ locale: { skipTo: "skip to" } }); //Get var text = $(".selector").igVideoPlayer("option", "locale").skipTo; //Set $(".selector").igVideoPlayer("option", "locale", { skipTo: "skip to"});
-
volume
- タイプ:
- bool
- デフォルト:
- ""
ボリューム ボタンのタイトルを取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ locale: { volume: "Volume" } }); //Get var text = $(".selector").igVideoPlayer("option", "locale").volume; //Set $(".selector").igVideoPlayer("option", "locale", { volume: "Volume" });
-
loop
- タイプ:
- bool
- デフォルト:
- false
ビデオの終了後、ビデオを再度開始するかどうかを取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ loop: true }); //Get var loop = $(".selector").igVideoPlayer("option", "loop"); //Set $(".selector").igVideoPlayer("option", "loop", true);
-
muted
- タイプ:
- bool
- デフォルト:
- false
ビデオの音量をミュートにするかどうかを取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ muted: true }); //Get var muted = $(".selector").igVideoPlayer("option", "muted"); //Set $(".selector").igVideoPlayer("option", "muted", true);
-
posterUrl
- タイプ:
- string
- デフォルト:
- ""
ビデオ データがない場合、表示する画像への URL を取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ posterUrl: "http://www.igniteui.com/images/samples/video-player/quince-intro-1.png" }); //Get var url = $(".selector").igVideoPlayer("option", "posterUrl"); //Set $(".selector").igVideoPlayer("option", "posterUrl", "http://www.igniteui.com/images/samples/video-player/quince-intro-1.png");
-
preload
- タイプ:
- bool
- デフォルト:
- false
ビデオ期間の読み込み初期データをプリロードするかどうかを取得または設定します。True の場合、ビデオのバッファリングを開始する場合もありますが、特定のブラウザーの実装によって異なります。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ preload: true }); //Get var preload = $(".selector").igVideoPlayer("option", "preload"); //Set $(".selector").igVideoPlayer("option", "preload", true);
-
progressLabelFormat
- タイプ:
- string
- デフォルト:
- "${currentTime} / ${duration}"
ビデオの進行状況ラベルの形式を取得または設定します。${currentTime} で現在の再生位置を表し、${duration} でビデオの期間を表す必要があります。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ progressLabelFormat:"Time=${currentTime} / Total=${duration}" }); //Get var labelFormat = $(".selector").igVideoPlayer("option", "progressLabelFormat"); //Set $(".selector").igVideoPlayer("option", "progressLabelFormat", "Time=${currentTime} / Total=${duration}");
-
regional
継承- タイプ:
- enumeration
- デフォルト:
- defaults
ウィジェットの領域設定を取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ regional: "ja" }); // Get var regional = $(".selector").igVideoPlayer("option", "regional"); // Set $(".selector").igVideoPlayer("option", "regional", "ja");
-
relatedVideos
- タイプ:
- array
- デフォルト:
- []
- 要素タイプ:
- object
ビデオ再生が終了したときに表示される関連ビデオの配列を取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ relatedVideos: [ { imageUrl: "http://www.soundbg.com/uploads/articles/d2b3270a_th.jpg", title: "Some cool skype video.", width: "80px", height: "80px", sources: ["http://medias.jilion.com/sublimevideo/dartmoor.mov", "http://medias.jilion.com/sublimevideo/dartmoor.mp4", "http://medias.jilion.com/sublimevideo/dartmoor.webm", "http://medias.jilion.com/sublimevideo/dartmoor.ogv" ] }, { imageUrl: "http://tweetmeme.s3.amazonaws.com/thumbs/375968078.jpg", title: "Bick buck bunny.", width: "80px", height: "80px", sources: ["http://snapshot.opera.com/resources/BigBuckBunny.ogv", "http://snapshot.opera.com/resources/BigBuckBunny.mp4", "http://snapshot.opera.com/resources/BigBuckBunny.webm" ] } ] }); //Get var relatedVids = $(".selector").igVideoPlayer("option", "relatedVideos"); //Set var relatedVids = [ { imageUrl: "http://www.soundbg.com/uploads/articles/d2b3270a_th.jpg", title: "Some cool skype video.", width: "80px", height: "80px", sources: ["http://medias.jilion.com/sublimevideo/dartmoor.mov", "http://medias.jilion.com/sublimevideo/dartmoor.mp4", "http://medias.jilion.com/sublimevideo/dartmoor.webm", "http://medias.jilion.com/sublimevideo/dartmoor.ogv" ] } ]; $(".selector").igVideoPlayer("option", "relatedVideos", relatedVids);
-
css
- タイプ:
- string
- デフォルト:
- null
関連するビデオ要素に適用されるカスタム CSS クラスを取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ relatedVideos: [ { imageUrl: "http://www.soundbg.com/uploads/articles/d2b3270a_th.jpg", title: "Some cool skype video.", width: "80px", height: "80px", css: "relatedVideosCss", sources: ["http://medias.jilion.com/sublimevideo/dartmoor.mov", "http://medias.jilion.com/sublimevideo/dartmoor.mp4", "http://medias.jilion.com/sublimevideo/dartmoor.webm", "http://medias.jilion.com/sublimevideo/dartmoor.ogv" ] } ] });
-
height
- タイプ:
- number
- デフォルト:
- null
関連するビデオ画像の高さを取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ relatedVideos: [ { imageUrl: "http://www.soundbg.com/uploads/articles/d2b3270a_th.jpg", title: "Some cool skype video.", width: "80px", height: "80px", sources: ["http://medias.jilion.com/sublimevideo/dartmoor.mov", "http://medias.jilion.com/sublimevideo/dartmoor.mp4", "http://medias.jilion.com/sublimevideo/dartmoor.webm", "http://medias.jilion.com/sublimevideo/dartmoor.ogv" ] } ] });
-
imageUrl
- タイプ:
- string
- デフォルト:
- ""
関連するビデオ画像の URL を取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ relatedVideos: [ { imageUrl: "http://www.soundbg.com/uploads/articles/d2b3270a_th.jpg", title: "Some cool skype video.", width: "80px", height: "80px", sources: ["http://medias.jilion.com/sublimevideo/dartmoor.mov", "http://medias.jilion.com/sublimevideo/dartmoor.mp4", "http://medias.jilion.com/sublimevideo/dartmoor.webm", "http://medias.jilion.com/sublimevideo/dartmoor.ogv" ] } ] });
-
link
- タイプ:
- string
- デフォルト:
- ""
関連するビデオを再生するページへのリンクを取得または設定します。新しいウィンドウで開きます。ソースもある場合は、リンク プロパティが優先されます。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ relatedVideos: [ { imageUrl: "http://www.soundbg.com/uploads/articles/d2b3270a_th.jpg", title: "Some cool skype video.", width: "80px", height: "80px", link: "http://medias.jilion.com/sublimevideo/dartmoor.mp4" } ] });
-
sources
- タイプ:
- array
- デフォルト:
- []
- 要素タイプ:
- object
関連するビデオのソースを取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ relatedVideos: [ { imageUrl: "http://www.soundbg.com/uploads/articles/d2b3270a_th.jpg", title: "Some cool skype video.", width: "80px", height: "80px", sources: ["http://medias.jilion.com/sublimevideo/dartmoor.mov", "http://medias.jilion.com/sublimevideo/dartmoor.mp4", "http://medias.jilion.com/sublimevideo/dartmoor.webm", "http://medias.jilion.com/sublimevideo/dartmoor.ogv" ] } ] });
-
title
- タイプ:
- string
- デフォルト:
- ""
ビデオのタイトルを取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ relatedVideos: [ { imageUrl: "http://www.soundbg.com/uploads/articles/d2b3270a_th.jpg", title: "Some cool skype video.", width: "80px", height: "80px", sources: ["http://medias.jilion.com/sublimevideo/dartmoor.mov", "http://medias.jilion.com/sublimevideo/dartmoor.mp4", "http://medias.jilion.com/sublimevideo/dartmoor.webm", "http://medias.jilion.com/sublimevideo/dartmoor.ogv" ] } ] });
-
width
- タイプ:
- number
- デフォルト:
- null
関連するビデオ画像の幅を取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ relatedVideos: [ { imageUrl: "http://www.soundbg.com/uploads/articles/d2b3270a_th.jpg", title: "Some cool skype video.", width: "80px", height: "80px", sources: ["http://medias.jilion.com/sublimevideo/dartmoor.mov", "http://medias.jilion.com/sublimevideo/dartmoor.mp4", "http://medias.jilion.com/sublimevideo/dartmoor.webm", "http://medias.jilion.com/sublimevideo/dartmoor.ogv" ] } ] });
-
showSeekTime
- タイプ:
- bool
- デフォルト:
- true
ビデオのプログレス バー上でマウスをホバーするときに、コントロール シーク ツール チップを表示するかどうかを取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ showSeekTime: false }); //Get var showTime = $(".selector").igVideoPlayer("option", "showSeekTime"); //Set $(".selector").igVideoPlayer("option", "showSeekTime", false);
-
sources
- タイプ:
- array
- デフォルト:
- []
- 要素タイプ:
- object
選択するビデオ ソースのリストを取得または設定します。コントロールによって、最適なコーデック/フォーマットが自動的に検出されます。サポートされるタイプは、ブラウザーによって異なり、mov、mp4、webm、ogg のいずれかです。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ sources: [ "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.h264.mp4", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.webmvp8.webm", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.theora.ogv" ] }); //Get var sources = $(".selector").igVideoPlayer("option", "sources"); //Set $(".selector").igVideoPlayer("option", "sources", ["http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.h264.mp4", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.webmvp8.webm", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.theora.ogv" ]);
-
title
- タイプ:
- string
- デフォルト:
- ""
ビデオのタイトルを取得または設定します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ title: "Ignite UI for jQuery" }); //Get var title = $(".selector").igVideoPlayer("option", "title"); //Set $(".selector").igVideoPlayer("option", "title", "Ignite UI for jQuery");
-
volume
- タイプ:
- number
- デフォルト:
- 0.5
ビデオの音量を取得または設定します。0.0 から 1.0 の間で設定できます。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ volume: 0.3 }); //Get var volLevel = $(".selector").igVideoPlayer("option", "volume"); //Set $(".selector").igVideoPlayer("option", "volume", 0.3);
-
volumeAutohideDelay
- タイプ:
- number
- デフォルト:
- 1000
音量スライダーの自動非表示の遅延時間を取得または設定します。Infragistics 再生コントロールを使用する場合のみの設定です。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ volumeAutohideDelay: 1500 }); //Get var delay = $(".selector").igVideoPlayer("option", "volumeAutohideDelay"); //Set $(".selector").igVideoPlayer("option", "volumeAutohideDelay", 1500);
-
width
- タイプ:
- enumeration
- デフォルト:
- null
コントロールの幅を取得または設定します。null の場合、他の高さが定義されていない場合 (デフォルト)、データがフィットするよう伸縮します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ width: 600, height: 400 }); //Get var width = $(".selector").igVideoPlayer("option", "width"); //Set $(".selector").igVideoPlayer("option", "width", 600);
Ignite UI コントロール イベントの詳細については、
Ignite UI でイベントを使用するを参照してください。
-
bannerClick
- キャンセル可能:
- false
バナーがクリックされると発生します。
関数は引数 evt および ui を受け取ります。コード サンプル
//Bind after initialization $(document).on("igvideoplayerbannerclick", ".selector", function (evt, ui) { //return the clicked banner element ui.bannerElement; }); //Initialize $(".selector").igVideoPlayer({ bannerClick: function (evt, ui) {...} });
-
bannerHidden
- キャンセル可能:
- true
バナーが非表示にされると発生します。
関数は引数 evt および ui を受け取ります。-
uiタイプ: Object
コード サンプル
//Bind after initialization $(document).on("igvideoplayerbannerhidden", ".selector", function (evt, ui) { //return the banner object from the banners array ui.banner; //return the banner html element in the DOM ui.bannerElement; //return the banner index in the banners array ui.index; }); //Initialize $(".selector").igVideoPlayer({ bannerHidden: function (evt, ui) {...} });
-
bannerVisible
- キャンセル可能:
- true
再生バナー表示イベントの名前を定義します。バナーが表示されるときに発生します。
関数は引数 evt および ui を受け取ります。-
uiタイプ: Object
コード サンプル
//Bind after initialization $(document).on("igvideoplayerbannervisible", ".selector", function (evt, ui) { //return the banner object from the banners array ui.banner; //return the banner html element in the DOM ui.bannerElement; //return the banner index in the banners array ui.index; }); //Initialize $(".selector").igVideoPlayer({ bannerVisible: function (evt, ui) {...} });
-
bookmarkClick
- キャンセル可能:
- true
ブックマークがクリックされると発生します。
関数は引数 evt および ui を受け取ります。-
uiタイプ: Object
コード サンプル
//Bind after initialization $(document).on("igvideoplayerbookmarkclick", ".selector", function (evt, ui) { //return a bookmark object from the bookmarks array ui.bookmark; //return the bookmark html element in the DOM ui.bookmarkElement; }); //Initialize $(".selector").igVideoPlayer({ bookmarkClick: function (evt, ui) {...} });
-
bookmarkHit
- キャンセル可能:
- true
ブックマークがクリックされると発生します。
関数は引数 evt および ui を受け取ります。-
uiタイプ: Object
コード サンプル
//Bind after initialization $(document).on("igvideoplayerbookmarkhit", ".selector", function (evt, ui) { //return the bookmark object from the bookmarks array ui.bookmark; //return bookmark html element in the DOM ui.bookmarkElement; //return the url of the playing video (the one that is used from the sources array) ui.source; }); //Initialize $(".selector").igVideoPlayer({ bookmarkHit: function (evt, ui) {...} });
-
browserNotSupported
- キャンセル可能:
- false
ブラウザーが HTML 5 ビデオをサポートしていない場合に発生します。
コード サンプル
//Initialize $(".selector").igVideoPlayer({ browserNotSupported: function (evt, ui) {...} });
-
buffering
- キャンセル可能:
- true
データのチャンクがバッファーされたときに発生します。
関数は引数 evt および ui を受け取ります。コード サンプル
//Bind after initialization $(document).on("igvideoplayerbuffering", ".selector", function (evt, ui) { //return the buffering precentage ui.buffered; //return the url of the playing video (the one that is used from the sources array) ui.source; }); //Initialize $(".selector").igVideoPlayer({ buffering: function (evt, ui) {...} });
-
ended
- キャンセル可能:
- true
ビデオの終了時に発生します。
関数は引数 evt および ui を受け取ります。コード サンプル
//Bind after initialization $(document).on("igvideoplayerended", ".selector", function (evt, ui) { //return the duration of the video in seconds ui.duration; //return the url of the playing video (the one that is used from the sources array) ui.source; }); //Initialize $(".selector").igVideoPlayer({ ended: function (evt, ui) {...} });
-
enterFullScreen
- キャンセル可能:
- true
igVideoPlayer が全画面表示モードに入るときに発生します。
関数は引数 evt および ui を受け取ります。コード サンプル
//Bind after initialization $(document).on("igvideoplayerenterfullscreen", ".selector", function (evt, ui) { //return the url of the playing video (the one that is used from the sources array) ui.source; }); //Initialize $(".selector").igVideoPlayer({ enterFullScreen: function (evt, ui) {...} });
-
exitFullScreen
- キャンセル可能:
- true
igVideoPlayer が全画面表示モードから終了するときに発生します。
関数は引数 evt および ui を受け取ります。コード サンプル
//Bind after initialization $(document).on("igvideoplayerexitfullscreen", ".selector", function (evt, ui) { //return the url of the playing video (the one that is used from the sources array) ui.source; }); //Initialize $(".selector").igVideoPlayer({ exitFullScreen: function (evt, ui) {...} });
-
paused
- キャンセル可能:
- true
ビデオが一時停止されると発生します。
関数は引数 evt および ui を受け取ります。-
uiタイプ: Object
コード サンプル
//Bind after initialization $(document).on("igvideoplayerpaused", ".selector", function (evt, ui) { //return the ellapsed time ui.currentTime; //return the duration of the video ui.duration; //return the url of the playing video (the one that is used from the sources array) ui.source; }); //Initialize $(".selector").igVideoPlayer({ paused: function (evt, ui) {...} });
-
playing
- キャンセル可能:
- true
ビデオが再生するときに発生します。
関数は引数 evt および ui を受け取ります。-
uiタイプ: Object
コード サンプル
//Bind after initialization $(document).on("igvideoplayerplaying", ".selector", function (evt, ui) { //return the ellapsed time ui.currentTime; //return the duration of the video ui.duration; //return the url of the playing video (the one that is used from the sources array) ui.source; }); //Initialize $(".selector").igVideoPlayer({ playing: function (evt, ui) {...} });
-
progress
- キャンセル可能:
- true
ビデオが再生位置に進むと発生します。
関数は引数 evt および ui を受け取ります。-
uiタイプ: Object
コード サンプル
//Bind after initialization $(document).on("igvideoplayerprogress", ".selector", function (evt, ui) { //return the current time(current position) in the video at which the event was fired ui.currentTime; //return the duration of the video ui.duration; //return the url of the playing video (the one that is used from the sources array) ui.source; }); //Initialize $(".selector").igVideoPlayer({ progress: function (evt, ui) {...} });
-
relatedVideoClick
- キャンセル可能:
- true
関連ビデオがクリックされたときに発生します。
関数は引数 evt および ui を受け取ります。-
uiタイプ: Object
コード サンプル
//Bind after initialization $(document).on("igvideoplayerrelatedvideoclick", ".selector", function (evt, ui) { //return the relatedVideo object from the relatedVideos array ui.relatedVideo; //return relatedVideo html element in the DOM ui.relatedVideoElement; }); //Initialize $(".selector").igVideoPlayer({ relatedVideoClick: function (evt, ui) {...} });
-
waiting
- キャンセル可能:
- true
igVideoPlayer がサーバーからのデータを待っているときに発生します。
関数は引数 evt および ui を受け取ります。-
uiタイプ: Object
コード サンプル
//Bind after initialization $(document).on("igvideoplayerwaiting", ".selector", function (evt, ui) { //return the current time(current position) in the video at which the event was fired ui.currentTime; //return the duration of the video ui.duration; //return the url of the playing video (the one that is used from the sources array) ui.source; }); //Initialize $(".selector").igVideoPlayer({ waiting: function (evt, ui) {...} });
-
changeGlobalLanguage
継承- .igVideoPlayer( "changeGlobalLanguage" );
ウィジェットの言語をグローバルの言語に変更します。グローバルの言語は $.ig.util.language の値です。
コード サンプル
$(".selector").igVideoPlayer("changeGlobalLanguage");
-
changeGlobalRegional
継承- .igVideoPlayer( "changeGlobalRegional" );
ウィジェットの地域設定をグローバルの地域設定に変更します。グローバルの地域設定は $.ig.util.regional にあります。
コード サンプル
$(".selector").igVideoPlayer("changeGlobalRegional");
-
changeLocale
- .igVideoPlayer( "changeLocale" );
ウィジェット要素のすべてのロケールを options.language に指定される言語に変更します。
注: このメソッドは珍しいシナリオのみで使用されます。language または locale オプションのセッターを参照してください。コード サンプル
$(".selector").igVideoPlayer("changeLocale");
-
currentTime
- .igVideoPlayer( "currentTime", val:number );
- 返却型:
- number
- 返却型の説明:
- 現在の再生位置を返します。
再生中のビデオの現在の時間を取得または設定します。
- val
- タイプ:number
- 移動したい再生位置を秒で指定します。
コード サンプル
//Get var currentTime = $(".selector").igVideoPlayer("currentTime"); //Set $(".selector").igVideoPlayer("currentTime", 60);
-
destroy
- .igVideoPlayer( "destroy" );
ウィジェットを破棄します。
コード サンプル
$(".selector").igVideoPlayer("destroy");
-
duration
- .igVideoPlayer( "duration" );
- 返却型:
- number
再生中のビデオの現在の再生時間を取得または設定します。期間がロードされていないか、ビデオがライブ ストリームの場合、NaN になることがあります。
コード サンプル
var duration = $(".selector").igVideoPlayer("duration");
-
ended
- .igVideoPlayer( "ended" );
- 返却型:
- bool
現在再生したビデオが終了したかどうかを取得します。
コード サンプル
var hasEnded = $(".selector").igVideoPlayer("ended");
-
hideAdMessage
- .igVideoPlayer( "hideAdMessage" );
広告メッセージが表示されている場合非表示にします。
コード サンプル
$(".selector").igVideoPlayer("hideAdMessage");
-
hideBanner
- .igVideoPlayer( "hideBanner", index:number );
広告バナーが表示されている場合非表示にします。
- index
- タイプ:number
- バナー配列からのバナーのインデックスを指定します。
コード サンプル
$(".selector").igVideoPlayer("hideBanner", 1);
-
pause
- .igVideoPlayer( "pause" );
現在の再生中のビデオがある場合、一時停止します。
コード サンプル
$(".selector").igVideoPlayer("pause");
-
paused
- .igVideoPlayer( "paused" );
- 返却型:
- bool
再生中のビデオが一時停止されているかどうかを返します。
コード サンプル
var isPaused = $(".selector").igVideoPlayer("paused");
-
play
- .igVideoPlayer( "play" );
現在読み込んでいるビデオがある場合再生します。
コード サンプル
$(".selector").igVideoPlayer("play");
-
playCommercial
- .igVideoPlayer( "playCommercial", commercial:object );
このビデオのリンク コマーシャルを再生します。
- commercial
- タイプ:object
- 再生するリンク コマーシャル指定します。
コード サンプル
var commercial = { sources: [ "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.h264.mp4", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.webmvp8.webm", "http://dl.infragistics.com/pg/2011-1/web/shared/videoplayer/videos/QuinceIntro_Part3_1.theora.ogv" ], startTime: 20, title: "Quince Presentation p1", link: "http://quince.infragistics.com/" }; $(".selector").igVideoPlayer("playCommercial", commercial);
-
resetCommercialsShow
- .igVideoPlayer( "resetCommercialsShow" );
コマーシャルをサイド表示するためにリセットします。
コード サンプル
$(".selector").igVideoPlayer("resetCommercialsShow");
-
screenshot
- .igVideoPlayer( "screenshot", [scaleFactor:number] );
現在のビデオ フレームのスクリーンショットを取得します。ページに配置して表示させるキャンバス オブジェクトを返します。これはキャンバスのブラウザー サポートに依存します。
- scaleFactor
- タイプ:number
- オプション
- スケール係数を 0~1 の間で指定します。
コード サンプル
var screen = $(".selector").igVideoPlayer("screenshot");
-
seeking
- .igVideoPlayer( "seeking" );
- 返却型:
- bool
プレーヤーが新しく再生する場所を検索するかどうかを取得します。
コード サンプル
var seeking = $(".selector").igVideoPlayer("seeking");
-
showBanner
- .igVideoPlayer( "showBanner", index:number );
広告バナーがある場合表示します。
- index
- タイプ:number
- バナー配列からのバナーのインデックスを指定します。
コード サンプル
$(".selector").igVideoPlayer("showBanner", 1);
-
supportsH264BaselineVideo
- .igVideoPlayer( "supportsH264BaselineVideo" );
- 返却型:
- bool
現在のブラウザーが H.264 codec をサポートするかどうかを取得します。
コード サンプル
var isSuppored = $(".selector").igVideoPlayer("supportsH264BaselineVideo");
-
supportsOggTheoraVideo
- .igVideoPlayer( "supportsOggTheoraVideo" );
- 返却型:
- bool
現在のブラウザーが Theora codec をサポートするかどうかを取得します。
コード サンプル
var isSuppored = $(".selector").igVideoPlayer("supportsOggTheoraVideo");
-
supportsVideo
- .igVideoPlayer( "supportsVideo" );
- 返却型:
- bool
現在のブラウザーがビデオ タグをサポートするかどうかを取得します。
コード サンプル
var isSuppored = $(".selector").igVideoPlayer("supportsVideo");
-
supportsWebmVideo
- .igVideoPlayer( "supportsWebmVideo" );
- 返却型:
- bool
現在のブラウザーが WEBM codec をサポートするかどうかを取得します。
コード サンプル
var isSuppored = $(".selector").igVideoPlayer("supportsWebmVideo");
-
togglePlay
- .igVideoPlayer( "togglePlay" );
コントロールの再生状態を切り替えます。ビデオが再生中の場合は一時停止、一時停止中の場合は再生します。
コード サンプル
$(".selector").igVideoPlayer("togglePlay");
-
widget
- .igVideoPlayer( "widget" );
ウィジェットがインスタンス化された要因を返します。
コード サンプル
var videoPlayer = $(".selector").igVideoPlayer("widget");
-
ui-igplayer-active-video
- コントロールが有効なときにメイン ビデオに適用される CSS クラスを取得または設定します。
-
ui-igplayer-ad-bookmark
- 組み込みコマーシャル ブックマークに適用される CSS クラスを取得または設定します。
-
ui-igplayer-ad-msg
- 再開ビデオ メッセージ範囲に適用される CSS クラスを取得または設定します。
-
ui-igplayer-ad-msg-close
- 再開ビデオ メッセージ閉じるボタンに適用される CSS クラスを取得または設定します。
-
ui-icon-close
- 再開ビデオ メッセージ閉じるボタンに適用される CSS クラスを取得または設定します。
-
ui-igplayer-ad-msg-container
- 再開ビデオ メッセージ コンテナーに適用される CSS クラスを取得または設定します。
-
ui-igplayer-banner ui-corner-all
- バナー コンテナー dv に適用される CSS クラスを取得または設定します。
-
ui-igplayer-banner-close
- バナー閉じるボタンに適用される CSS クラスを取得または設定します。
-
ui-icon-close
- バナー閉じるアイコンに適用される CSS クラスを取得または設定します。
-
ui-igplayer-banner-container
- バナー コンテナー dv に適用される CSS クラスを取得または設定します。
-
ui-widget ui-igplayer
- ウィジェット ベース CSS クラスを取得または設定します。
-
ui-igplayer-bookmark-active-item
- ブックマーク領域にアクティブなブックマーク項目を表示する CSS クラスを取得または設定します。
-
ui-widget ui-igplayer-bookmark-container
- ブックマーク コンテナー DIV に適用される CSS クラスを取得または設定します。
-
ui-widget-header ui-igplayer-bookmark-header
- ブックマーク ヘッダー コンテナーに適用される CSS クラスを取得または設定します。
-
ui-igplayer-bookmark-item-disabled
- ブックマーク領域の項目が無効な場合にブックマーク リスト項目に適用される CSS クラスを取得または設定します。
-
ui-igplayer-bookmark-item-time
- ブックマーク領域に日時を表示するブックマーク リスト項目に適用される CSS クラスを取得または設定します。
-
ui-igplayer-bookmark-item-title
- ブックマーク領域に件名を表示するブックマーク リスト項目に適用される CSS クラスを取得または設定します。
-
ui-widget-content ui-igplayer-bookmark-list
- ブックマーク領域のブックマーク リスト項目に適用される CSS クラスを取得または設定します。
-
ui-igplayer-centerplaybutton-pause
- センター一時停止ボタンに適用される CSS クラスを取得または設定します。
-
ui-igplayer-centerplaybutton-play
- センター再生停止ボタンに適用される CSS クラスを取得または設定します。
-
ui-igplayer-centerplaybutton-icon
- センター再生ボタンに適用される CSS クラスを取得または設定します。
-
ui-widget-header ui-igplayer-controls
- プレーヤー コントロール CSS クラスを取得または設定します。
-
ui-igplayer-controls-hide
- コントロール非表示 CSS クラスを取得または設定します。コントロール自動非表示に適用されます。
-
ui-igplayer-fullscreen-button
- 再生コントロールの全画面ボタンに適用される CSS クラスを取得または設定します。
-
ui-icon ui-igbutton-icon ui-icon-arrow-4-diag
- 全画面ボタン アイコンに適用される CSS クラスを取得または設定します。
-
ui-igplayer-linked-bookmark
- リンク コマーシャル ブックマークに適用される CSS クラスを取得または設定します。
-
ui-igplayer-playbutton
- 再生コントロールの再生ボタンに適用される CSS クラスを取得または設定します。
-
ui-igplayer-progressbar ui-corner-all
- 再生コントロールのスライダー ウィジェットに適用される CSS クラスを取得または設定します。
-
ui-igplayer-progresslabel
- 再生コントロールの進行状況ラベルに適用される CSS クラスを取得または設定します。
-
ui-igplayer-related-video-bar
- 再生および全画面ボタンを含む関連ビデオボタン領域に適用される CSS クラスを取得または設定します。
-
ui-igplayer-related-video
- 関連ビデオ要素に適用される CSS クラスを取得または設定します。
-
ui-igplayer-related-video-first
- 最初の関連ビデオ要素に適用される CSS クラスを取得または設定します。
-
ui-igplayer-related-video-hover
- 関連ビデオ ホバーに適用される CSS クラスを取得または設定します。
-
ui-igplayer-related-video-last
- 最後の関連ビデオ要素に適用される CSS クラスを取得または設定します。
-
ui-igplayer-related-video-replay
- 関連ビデオ領域の再生ボタンに適用される CSS クラスを取得または設定します。
-
ui-icon-arrowrefresh-1-s
- 再生ボタン アイコンに適用される CSS クラスを取得または設定します。
-
ui-igplayer-related-video-container
- 関連ビデオ コンテナー クラスに適用される CSS クラスを取得または設定します。
-
ui-igplayer-related-scroller-left
- 左スクロール ボタンに適用される CSS クラスを取得または設定します。
-
ui-icon-triangle-1-w
- 左スクロール ボタン アイコンに適用される CSS クラスを取得または設定します。
-
ui-igplayer-related-list
- 関連ビデオ リストに適用される CSS クラスを取得または設定します。
-
ui-igplayer-related-scroller-right
- 関連ビデオの右スクロール ボタンに適用される CSS クラスを取得または設定します。
-
ui-icon-triangle-1-e
- スクロール ボタンの右アイコンに適用される CSS クラスを取得または設定します。
-
ui-igplayer-related-video-header
- 関連ビデオ ヘッダー クラスに適用される CSS クラスを取得または設定します。
-
ui-igplayer-related-video-outer-container
- 関連ビデオ コンテナー クラスに適用される CSS クラスを取得または設定します。
-
ui-igplayer-seektooltip
- 検索ツールチップに適用される CSS クラスを取得または設定します。
-
ui-html5-non-html5-supported-message ui-helper-clearfix
- プレーヤーがHTML 5 をサポートしていないブラウザーで開かれたときに表示されるスパン要素に適用されるクラスを取得または設定します。
-
ui-igplayer-not-supported-video-source
- ビデオ ソースがサポートされていないときに表示されるアンカー要素に適用される CSS クラスを取得または設定します。
-
ui-igplayer-not-supported-video-source-icon
- サポートされないビデオ ソース アイコンを表示するアンカー要素に適用される CSS クラスを取得または設定します。
-
ui-igplayer-video
- メイン ビデオ要素に適用されるクラスを取得または設定します。
-
ui-igplayer-volumecontrol
- 再生コントロールの音量コントロール ボタンに適用される CSS クラスを取得または設定します。
-
ui-igplayer-volumeslider
- 再生コントロールの音量スライダーに適用される CSS クラスを取得または設定します。
-
ui-igplayer-waiting
- バッファー インジケーターに適用される CSS クラスを取得または設定します。
-
ui-igplayer-waiting-icon
- バッファー インジケーター アイコンに適用される CSS クラスを取得または設定します。