Yahoo!のYQLを使ってニコ動の動画情報を取得して表示します。
下記のjQueryプラグインを先に読み込んでから使ってください
Cross-domain requests with jQuery
下記のファイルを読み込んでください。
- jquery.nicothumb.js
<script type="text/javascript" src="jquery.nicothumb.js"></script>jquery.xdomainajax.jsの後ろで読み込んでください。
$("#video_info").nicothumb({
video_id: "sm9"
});$(".info").nicothumb({
video_id: "sm9",
insert: false,
callback: function (video_info){
// コールバック
console.log(video_info);
}
});$(".info").nicothumb({
video_id: "sm9",
template: "<h1>{title}</h1><img src='{thumbnail_url}' alt='サムネ'>"
});| キー | 説明 | 初期値 |
|---|---|---|
video_id |
動画ID | sm9 |
insert |
htmlを挿入するか | true |
template |
挿入するhtmlテンプレート | テンプレートについてを参照 |
callback |
取得後に実行されるメソッド | function(){} |
テンプレート内で使える変数っぽいやつです。
| 変数 | 説明 |
|---|---|
{title} |
動画タイトル |
{view_counter} |
再生数 |
{comment_num} |
コメント数 |
{mylist_counter} |
マイリスト数 |
{length} |
再生時間 |
{watch_url} |
動画URL |
{thumbnail_url} |
サムネイルURL |
初期値
""
+ "<h1><a href=\"{watch_url}\">{title}</a></h1>"
+ "<a href=\"{watch_url}\">"
+ "<img src=\"{thumbnail_url}\" alt=\"サムネイル\">"
+ "</a>"
+ "<p>再生数: <span>{view_counter}</span></p>"
+ "<p>コメント数: <span>{comment_num}</span></p>"
+ "<p>マイリスト数: <span>{mylist_counter}</span></p>"
+ "<p>再生時間: <span>{length}</span></p>"Reona Oshima (totoraj)
Copyright © 2015 Reona Oshima (totoraj)
This work is released under the MIT License.
http://opensource.org/licenses/mit-license.php
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent