Ignite UI™ API ヘルプ

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'});

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 でイベントを使用するを参照してください。

注: API メソッドの呼び出しは、API ヘルプに特に記述がない限り、操作に関連するイベントはプログラムによって発生されません。これらのイベントは各ユーザー操作によってのみ呼び出されます。

詳細の表示

bannerClick

キャンセル可能:: false

バナーがクリックされると発生します。
関数は引数 evt および ui を受け取ります。

ui
タイプ: Object

コードサンプル

//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 を受け取ります。

ui
タイプ: Object

コードサンプル

//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 を受け取ります。

ui
タイプ: Object

コードサンプル

//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 を受け取ります。

ui
タイプ: Object

コードサンプル

//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 を受け取ります。

ui
タイプ: Object

コードサンプル

//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 クラスを取得または設定します。

Ignite UI for jQuery | API リファレンス

ui.igVideoPlayer

コード サンプル

関連サンプル

関連トピック

依存関係

継承

コードサンプル