Ustreamの動画をウィンドウの右下に表示するソース [メール投稿]
表示するチャンネルを切り替えるJavascriptを作っているのだけど、埋め込みコードにチャンネル名を使わないこともネックになってる。→【Ustream「埋め込み再生」機能を全ユーザーに開放 | Ustream News】 http://t.co/97edmlP3l4
— 正己 (@self7777) 2015, 9月 21とりあえず、作った。簡易版なのでヘッダは適当。
ウインドウサイズは1680×1050が前提。IE11での利用を想定。
<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<title>USTREAM</title>
<script type="text/javascript">
function newsrc() {
var url="http://www.ustream.tv/embed/" +document.ust.ustid.value+ "?html5ui=1";
document.getElementById("Ustream").src = url;
}
</script>
</head>
<body>
<iframe width="360" height="203" src="" allowfullscreen="true" webkitallowfullscreen="true" scrolling="no" frameborder="0" style="border: 0px none transparent;" name="Ustream" id="Ustream"></iframe>
<br />
<form id="ust" name="ust">
<a href="http://www.ustream.tv" style="font-size: 12px; line-height: 20px; font-weight: normal; text-align: left;" target="_blank">Ustream</a>
<input type="text" id="ustid" name="ustid" style="width:200px;" />
<a href="javascript:newsrc();" style="font-size:12px;">開く</a>
<a href="#" onclick="window.open('Ustream.htm','','width=370,height=223,left=1310,top=827,location=yes,resizable=yes');return false;" style="font-size:12px;">追加</a>
</form>
</body>
</html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<title>USTREAM</title>
<script type="text/javascript">
function newsrc() {
var url="http://www.ustream.tv/embed/" +document.ust.ustid.value+ "?html5ui=1";
document.getElementById("Ustream").src = url;
}
</script>
</head>
<body>
<iframe width="360" height="203" src="" allowfullscreen="true" webkitallowfullscreen="true" scrolling="no" frameborder="0" style="border: 0px none transparent;" name="Ustream" id="Ustream"></iframe>
<br />
<form id="ust" name="ust">
<a href="http://www.ustream.tv" style="font-size: 12px; line-height: 20px; font-weight: normal; text-align: left;" target="_blank">Ustream</a>
<input type="text" id="ustid" name="ustid" style="width:200px;" />
<a href="javascript:newsrc();" style="font-size:12px;">開く</a>
<a href="#" onclick="window.open('Ustream.htm','','width=370,height=223,left=1310,top=827,location=yes,resizable=yes');return false;" style="font-size:12px;">追加</a>
</form>
</body>
</html>
Ustream.htmの所は自分の作ったhtmlファイルの名前。
ブックマークレットのリンクは次の通り。
javascript:(function(){window.open('Ustream.htm','','width=370,height=223,left=1310,top=827,location=yes,resizable=yes');})();
Ustream.htmの所は自分の作ったhtmlファイルのURL。
ウインドウの入力欄にはチャンネル名ではなく、埋め込みコードのsrc=""の中にあるURLの/embed/の後ろの数字を入れる。「開く」をクリックすると、白紙の所に動画が表示される。動画は、クリックしないと開始しない。
ウインドウの「追加」をクリックすると同じ大きさの白紙のウインドウが同じ位置に表示される。ドラッグ＆ドロップで別の位置に持って行って、入力欄に該当の数字を入力して「開く」をクリックして別の動画を同時に見る。
正己 さん
Banner & Logo
