jQueryの基本 - $(document).ready - QiitaDeleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?
★video要素、audio要素をJavaScriptから操作する
※このページでは、video要素、audio要素をJavaScriptから操作する方法について紹介しています。 単純に<video>タグや<audio>タグの使い方を知りたい方は、 以下のページなどをご確認ください。 <video>タグで動画を埋め込む <video> …… 動画を再生する <audio> …… 音声を再生する ■video要素、audio要素をJavaScriptから操作 HTML5では、video要素、audio要素をJavaScriptから操作するためのメソッド・プロパティ・イベントが用意されています。 これらのメソッド・プロパティ・イベントを使用することで、 JavaScriptから動画・音声などのメディアリソースの状態を参照したり、 読み込み・再生・一時停止・再生可能かどうかの確認などの操作が可能となります。 <video>タグのcontrols属性を指定すると、
HTML5 audioタグでの音源の再生,停止,ミュート,スキップ,初期化,現在の再生時間取得などのまとめ | Stronghold Archive
HTML5 audioタグでの音源の再生,停止,ミュート,スキップ,初期化,現在の再生時間取得などのまとめ どうもこんばんは。Toshikuraです。今回のTipsは【HTML5 audioタグでの音源の再生,停止,ミュート,スキップ,初期化,現在の再生時間取得などのまとめ】です。以前「HTML5 audio 音源の拡張子やブラウザの対応状況」という記事でも一部書きましたが、本記事はより具体的な続編です。タイトルでは”等”と省略しましたが、音の再生、一時停止、特定時間への移動、スキップ、リセット、ミュート、再生速度の上げ下げ、再生時間の取得、合計時間の取得、ボリュームの指定、jQueryを使ったオリジナルプログレスバーの設定、はたまた再生中やボリューム変更等のタイミング取得が対象になります。 はじめに まずはじめに、HTML5でのaudioタグの基本的な記述です。このタグにloopやcon
)
Using JavaScript to Control the Audio Object (Windows)
The audio object in HTML5 provides methods, properties, and events that you can use to control playback from JavaScript. This section includes the following topics: Playing and pausing audio playback in JavaScript Specifying audio files and managing playback in JavaScript Catching errors Related topics Playing and pausing audio playback in JavaScript The HTML5 audio element as described in Getting
RPGツクールMVのプラグイン開発環境の作り方 - Qiita
海外で話題沸騰のRPGツクールMV(RPGMaker MV)ですが、 まだ、日本語版はベータテスト中とのことです。 今回は、このRPGツクールMVのプラグイン開発環境の作り方を簡単に紹介したいと思います。 このRPGツクールMVのすごい所は、なんといっても、 一回作ったら Windows, Mac, Android, iOS, Webのアプリとして ゲームを出力する所もそうなのですが、 それよりも今回は、 Node.js で作られていることもあって、 プラグインが作りやすく、 ぶっちゃけなんでもできる！という所が本当にすごい所です。 こんなゲームをすぐ作ってWeb公開することができます。 このRPGツクールは、 Node.jsの nw.js がベースとなっており、 描画エンジンは、Pixi.js、両方のAPIをある程度調べれば 普通のデスクトップアプリから、RPG以外のジャンルのゲーム、ネ
Dateオブジェクト (日付と時刻) | JavaScript プログラミング解説
Dateオブジェクトが扱える範囲は、1970年1月1日の前後273,785年です。よって275755年まで扱えることになります。 オブジェクトの生成 new Date() 引数を指定しないと、現在の日時でDateオブジェクトが生成されます。 new Date( milliseconds ) 1970/1/1 UTCからmillisecondsミリ秒経過した日時と解釈されます。 new Date( year, month, day [, hour, minute, second, millisecond] ) Date - JavaScript | MDN monthは0が起点のため、1月ならば0、12月ならば11のように指定します。 newを省略すると、引数が無視され現在の日時が文字列で返されます。 文字列からの生成 (new Date()) Date.parse( datestring
Date - JavaScript | MDN
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. * Some parts of this feature may have varying levels of support. Learn moreSee full compatibilityReport feedback JavaScript の Date オブジェクトは、単一の瞬間の時刻をプラットフォームに依存しない形式で表します。Date オブジェクトは、1970 年 1 月 1 日午前 0 時 (UTC)（元期）からのミリ秒を表す整数値をカプセル化しています。
String.prototype.trim() - JavaScript | MDN
標準組み込みオブジェクトStringコンストラクターString() コンストラクター静的メソッドString.fromCharCode()String.fromCodePoint()String.raw()インスタンスメソッドString.prototype.anchor() 非推奨; String.prototype.at()String.prototype.big() 非推奨; String.prototype.blink() 非推奨; String.prototype.bold() 非推奨; String.prototype.charAt()String.prototype.charCodeAt()String.prototype.codePointAt()String.prototype.concat()String.prototype.endsWith()String.prot
element.offsetParentプロパティ - JavaScript（ジャバスクリプト）リファレンス
サンプルの動作について 黄色のボックス要素をクリックすると、position属性がrelativeで、黄色のボックス要素から最も近い祖先要素であるのは、緑色のボックス要素なので、「最も近い祖先要素の背景色：」の右側の「■」を緑色にする。 紫色のボックス要素をクリックすると、position属性がrelativeで、紫色のボックス要素から最も近い祖先要素であるのは、青色のボックス要素なので、「最も近い祖先要素の背景色：」の右側の「■」を青色にする。 サンプルのソースコード <script> window.onload = function () { document.getElementById( "sample-div-yellow" ).onclick = offsetParentA; document.getElementById( "sample-div-purple" ).oncl
jQuery deferredの使い方 | 前編 deferredの基本
jQuery deferredの使い方 前編 deferredの基本 jQuery deferredをなんとなく知っているが使い方がよくわからない人のために短期シリーズでおさらいをします。第1回目は非同期処理の概念からdeferredの基本機能までをおさえます。 なぜ、今、jQuery deferred？ この短期シリーズでは、2回に分けてjQuery deferredについて解説します。 jQuery deferredは、jQuery1.5で追加された機能であり、特に新しいものではありません。 しかしながら、私が昔書いたjQuery deferredに関するブログ記事をブックマークする人が、いまだにちょこちょこいるのが見受けられるのです。 もしかして、deferredの存在はなんとなく知っているけれど、どのように使ったらいいのかよくわからないという人が多いのかもしれないと思い、改めてまと
$.post() | jQuery 1.9 日本語リファレンス | js STUDIO
$.postは$.ajaxの略記です。$.ajax関数で次のように指定した処理と同じ処理を実行します。 $.ajax({ type: 'POST', url: url, data: data, success: success, dataType: dataType }); デモ test.phpにリクエストを送信します。サーバが返す値について、処理は行いません。 $.post("test.php"); test.phpにデータをリクエスト(POST)送信します。サーバが返す値について、処理は行いません。 $.post("test.php"); test.phpに配列データをリクエスト(POST)送信します。サーバが返す値について、処理は行いません。 $.post("test.php", { 'choices[]': ["Jon", "Susan"] } ); test.phpにフォームの
LocalStorageとは？ その使い方を徹底解説！
今回はHTML5で新たに追加されたLocalStorageをご紹介します。今まではアクセスしたユーザの情報を永続的に保持するためには、クッキーやセッションを使用しなければなりませんでした。サーバサイドではこの方法で問題ないのですが、これをフロントエンドで実現するには一手間必要です。javascriptでクッキーを簡単に扱うためのプラグインのjquery.cookieなんかは割と有名かと思います。 SessionStorageの使い方はこちら→javascriptでセッション？HTML5 SessionStorageの使い方 LocalStorageとはWebStorageと呼ばれるものの一つで、javascriptを用いてクライアント側にデータを保存する仕組みです。ユーザのローカル(ブラウザ)にデータを保存することができるので、半永久的にデータを保持することができます。データの読み込み・更
今さらながらJavaScriptのwindow.openについて調べてみた。 - 小さい頃はエラ呼吸
はじめに JavaScriptで新規ウインドウを表示するコードを書いていて、ちょっとつまづいたので、今さらながらJavaScriptのwindow.openや親子ウインドウの制御について調べてみました。※以下のコードはすべてIE7で検証しています。 ノンプログラマのためのJavaScriptはじめの一歩 (WEB+DB PRESS plus)posted with amazlet at 13.01.23外村 和仁 技術評論社 売り上げランキング: 17,179 Amazon.co.jp で詳細を見る window.openメソッドの使い方 window.openメソッドの第１パラメタには、表示するファイルを指定します。第２パラメタにはウインドウの名前、第３パラメタには、子ウインドウに対するオプションを指定します。第１パラメタ以外は、省略可能です。（ちなみにwindow.の部分も省略可能です
Yahoo! UI Library 3（YUI3）の基本
「Yahoo! User Interface Library Ver.3」（YUI3）はYahoo!が開発した、Webのページを作成するための汎用ツールライブラリーです。オープンソースで無償で提供されており、アニメーション効果やドラッグ＆ドロップ、データ取得やイベントの応答など、多岐にわたる機能がサポートされています。今回はまずYUI3の全体像を紹介します。 はじめに Yahoo!は、米国時間9月29日に「Yahoo! User Interface Library Ver.3」（YUI3）をリリースしました。YUI3はJavaScriptやCSS（Cascading Style Sheet）で書かれた、Ajaxライブラリーです。 Yahoo!は今まで、インターネットによる情報提供のためのさまざまなツールを作成してきました。開発したツールの中でも、Webのページを作成するのに汎用的に使えるツ
Javascriptで開いた子画面から親画面の関数を呼び出す
Javascriptで開いた子画面（ポップアップウィンドウ）から、親画面の関数を呼び出します。 子画面から親画面を操作するにはwindow.openerを使う Javascript子画面から親画面を操作するにはwindow.openerを使います。 それを応用すると子画面から親画面の関数や変数が利用できるようになります。 (親画面のソース） <html> <head> <script language="JavaScript"> function parentFunc(myname) { var innerObj = document.getElementById( "my_name" ) ; innerObj.innerHTML = "私の名前は" + myname + "です。" } function childDsp() { window.open( "子画面のURL", "chil
jQuery UIのDraggableで快適なドラッグアンドドロップライフを！ | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは。づやです。 さて、要素をドラッグアンドドロップさせてなんかしたいっていう要望は割とあると思うのですが、個人的には5年くらいその処理が必要とならず、あまり考えることがありませんでした。 そこで最近はどんな感じでできるのかなあ、と思っておりまして、ちょっと調べてみたことをまとめます。 5年前はprototype.jsとプラグインを利用していたのですが、今回はjQueryとプラグインで実装してみたいと思います。 便利なjQuery UIのDraggableを利用します と言っても、jQuery UIを利用すれば超簡単にできる模様なので、まずは作ってみました。 ※コードは大事な所だけ抜粋しています <html> <head> <!-- まずjQueryとjQuery UIを読み込みます。今回はCDNから読み込んでます --> <script src="//ajax.googleapis
Ajax - jQuery 入門
jQuery を利用することで Ajax (エイジャックス) のコードもかなり簡易化することが可能です。 一般には Ajax を利用するに際して jQuery を利用する動機としてはブラウザの違いを吸収するということに加えて、ネットワークを介する呼び出しとなることから煩雑になりがちなエラー処理をスマートに行うということがあげられます。 ここでは具体例を通して使い方をみていきます。 jQuery 1.8 以降でそれ以前の Ajax メソッド (success, error, complete) は deprecated というステータスになりました。 こちらの新しい Ajax 利用方法を参考にしてください。 サーバーから HTML を取得して、 div 要素にセットする ここではボタンをクリックした時に、バックエンドでサーバーから HTML 文書を取得し、その HTML をそのまま div
Mochaを使ってJavaScriptのテストをブラウザで実行してみよう
対象読者 JavaScriptの基本をある程度理解している方 テストコードをこれから書こうと考えている方 JavaScriptのテスティングライブラリの分類 JavaScriptには、テストを記述するためのライブラリが多く用意されています。ライブラリには、大きく分けて「テスティングフレームワーク」と「アサーションライブラリ」があります。まずはこの2種類の違いについて説明します。 テスティングフレームワーク テストを記述する関数群を提供し、それらの関数を使って書かれたテストの結果を判定、集計した上で結果を表示する機能を持ちます。ブラウザでのテストの場合、ブラウザ上でグラフィカルにテスト結果を表示することもありますし、サーバサイドのJavaScriptであるNode.js向けにはコマンドラインで実行し、結果を表示する機能も持ちます。 アサーションライブラリ テスティングフレームワークは、テスト
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
JavaScriptの配列の使い方まとめ。要素の追加,結合,取得,削除。 - Qiita
Jasmine使い方メモ - Qiita
