All-in-one animation engine. A fast and versatile JavaScript library to animate the web.
Anime.js | JavaScript Animation Engine
All-in-one animation engine. A fast and versatile JavaScript library to animate the web.
window.postMessage()の学習 - sugilogのブログ
javascriptのwindow間のメッセージングについて、存在は知っていたけどちゃんとコードとして落とし込めていなかったので学習。 参照先は以下の2サイト http://d.hatena.ne.jp/bannyan/20090820/1250789189 https://developer.mozilla.org/ja/DOM/window.postMessage window.postMessage 他のwindowに対して、messageを送る。 => window.postMessage(); windowを超えてクロスドメインでアクセスしようとすると、permission deniedになったり、undefinedになったりするけど、postMessageは有効に使える。 引数は第2引数まで取る。（第2引数まで必須。） otherWindow.postMessage(messa
【JavaScript】複数の子ウィンドウを閉じる
みなさん、こんにちは。 先日、とあるプロジェクトで以下のような機能が必要になりました。 ・複数のウィンドウを開く ・開いたウィンドウは、あるイベントをトリガーにして全て閉じる 開いたウィンドウを閉じるには、 ウィンドウを開く際に、開いたウィンドウオブジェクトを変数に割り当てる必要があります。 開くウィンドウが一つの場合は、グローバル変数を用意して、 そこにウィンドウオブジェクトを割り当てることにより実現が出来ます。 下記がそのサンプルです。 弊社のホームページです。 しかし、複数ウィンドウの場合は工夫が必要になります。 簡単な工夫ですが、最初はどのように対応しようか悩みました。 工夫とは、ウィンドウオブジェクトを入れる変数を配列にすることです。 下記がそのサンプルです。 弊社のホームページです。 思いつけば、なんてことはないですね。
Web Messaging API を使ってみる - Qiita
目的 HTML5 に Web Messaging API というのがある。サーバを介さずブラウザ間で通信ができるインターフェイスが提供されている。 調査がてら把握したことを整理。 概要と用途 Web Messaging API はブラウザの任意のドキュメント間での通信をサポートするインターフェイス。現在、postMessage と MessageChannel という API が用意されている。どちらも任意の window オブジェクト同士で、任意のタイミングでデータの受送信をさせることが可能。 よく使われる用途として、iframe で別ドメインのコンテンツを読み込み、そのドメインと通信させる。 例えば、Facebook のいいねボタンは、 iframe で facebook.com のドメインを埋め込み通信させ、その中の cookie の値を取得してそのブラウザが保持するユーザ情報を表示
JavaScriptでバイナリファイルを扱う方法 - Tech-Sketch
HTML5によって、<audio>や<video>などメディアファイルを扱う機能が拡充され、JavaScriptからも音声ファイルが取り扱えるようになりました。 各ブラウザ毎に対応状況は異なりますが、これらの機能を有効活用するためAjaxリクエストによって音楽のバイナリファイルを取得し、再生するまでのJavaScriptをまとめてみました。 はじめに HTML5によって、<audio>や<video>などメディアファイルを扱う機能が拡充され、JavaScriptからも音声ファイルが取り扱えるようになりました。 ということで、各ブラウザ毎に対応状況は異なりますが、Ajaxリクエストによって音楽のバイナリファイルを取得し、再生するまでのJavaScriptをまとめてみました。サンプルは音声ファイルの受信、再生をCoffee Scriptで書いたものですが、バイナリファイルを取得した後の処理
Scratch Extensions
Documentation has moved The extensions documentation has moved to the ScratchX Wiki
メディアアート系で重要な数式・概念 & p5.jsで遊ぶ - Qiita
高校数学がボロボロでも大丈夫です。（ もともと個人的にインプットし貯めていたものですが、書きなおして公開します。 地味ですが、派手な動きはこの地味な数式・概念がベースになってきます。 また、メディアアートとは言ったものの、ゲーム制作などにも役立つでしょう。 「ラジアンとは？」「サイン波を描く」「円軌道を描く」「弾幕（2点間の距離系&角度系）」「多角形を描く」「フラクタル」といったテーマです。 また、そのプレイグラウンドとしてp5.js（Processingのjs版）をご紹介します。2014年にリリースされたものでまだマイナーですがCodePenのような海外サイトでは人気が出つつあります。またProcessing公式プロジェクトなので安心感もありますね。ちなみに、Processing.jsとは別プロジェクトです。 ラジアンとは？ ・ラジアンは単位 角度についてのもう一つの単位です。 角度とラ
とほほのJavaScript入門 - とほほのWWW入門
とほほのJavaScript入門 (JavaScriptリファレンス) [戻る] [索引] 基本編 JavaScript って何？ JavaScript とは？ JavaScript と Java の関係は？ ECMAScript とは？ JavaScript のバージョン ES5 の新機能 ES5.1 の新機能 ES2015(ES6) の新機能 ES2016(ES7) の新機能 ES2017(ES8) の新機能 ES2018(ES9) の新機能 ES2019(ES10) の新機能 ES2020(ES11) の新機能 ES2021(ES12) の新機能 ES2022(ES13) の新機能 ES2023 の新機能 ES2024 の新機能 ES2025 の新機能 まずは始めてみよう 準備するもの 「Hello world!!」と書いてみよう 時刻を表示してみよう 動く時計を表示してみよう Ja
Turn.js: The page flip effect in HTML5
Turn.js is a JavaScript library that will make your content look like a real book or magazine using all the advantages of HTML5. The web is getting beautiful with new user interfaces based in HTML5; turn.js is the best fit for a magazine, book or catalog based in HTML5. <div id="flipbook"> <div class="hard"> Turn.js </div> <div class="hard"></div> <div> Page 1 </div> <div> Page 2 </div> <div> Page
GorillaScript
Table of contents Why not use JavaScript? JavaScript has a lot of warts in the language and while the ECMAScript community is doing a good job with its upcoming revisions, it’s still left with a lot of the old cruft. Also, for those who want to code for older browsers, all the shiny new features that the newer versions of ECMAScript provide are for all intents and purposes unreachable. Some of the
JavaScriptで日付を扱うならこれ！「moment.js」
■ つかいかた（基礎編） ダウンロードしたmoment.jsをscriptタグで読み込ませたら準備完了です。 あとは下記のような実装で使用できます。 // momentオブジェクトを初期化して・・・ var m = moment(); // formatで出力! var output = m.format("YYYY年MM月DD日 HH:mm:ss dddd"); console.log(output); // => 2013年05月15日 12:34:56 Wednesday // 現在時刻 moment(); // ミリ秒で指定 moment(1368543600000); // タイムスタンプ（秒）で指定 moment.unix(1368543600); // Date.parseで解析可能な文字列を指定 moment("May 15, 2013"); // Dateオブジェクトか
『JavaScriptの開発効率を高める7つのライブラリ』
1 pixel｜サイバーエージェント公式クリエイターズブログ サイバーエージェントのクリエイターの取り組みを紹介するオフィシャルブログです。最新技術への挑戦やサービス誕生の裏話、勉強会やイベントのレポートなどCAクリエイターの情報が満載です。
jqコマンドが実は高性能すぎてビビッた話
GWが始まりましたが、鎌倉のGWは観光客多すぎて逆に住民はげんなりして外に出なくなる感じです。とはいえ路地まで観光客が攻め込んでくることは少ないので、路地を散歩する分には天気がよくていい感じですね。ちなみに人力車のおにーさんはそういう味のある路地を知り尽くしているので人力車で移動するのはそこそこオススメです(ぼくは乗ったことないけど「こんなところも通るんだ!」ってところで見かけたりします)。 さて、jqというコマンドをご存じでしょうか。 jq jq is a lightweight and flexible command-line JSON processor. と書いてあるとおり、コマンドラインでJSONを扱うことができるコマンドです。で、今まさに仕事で巨大JSONと戦うことが多く、このコマンドが大活躍です。 とはいえ、ぼくの使い方としては「巨大JSONをキレイに整形して表示する」とい
jsdo.it
Come creare il miglior gioco da casinò Quando si progetta un gioco da casinò, la prima cosa che devi considerare è che tipo di gioco sarà. Ci sono molti diversi tipi di giochi da casinò, dalle slot e video poker ai giochi da tavolo e giochi di carte. Dovrai decidere quale tipo di gioco si adatta meglio alle tue esigenze. Ogni tipo di gioco ha il proprio set di regole e regolamenti, quindi dovrai a
JSONデータをソートする方法
JSONデータをソートする方法を紹介します。 ブラウザやPC環境等に依存するかもしれませんが、FirefoxやGoogle Chromeといった最近のブラウザであれば数千行のデータでも1秒かからない程度でソートして表示されます。すべてのブラウザで確認していないので不具合があったらすいません。 引用サイトは下記です。 How to sort a JSON array ? １．基本 次のようなJSONデータがあると仮定します。 var data = [ {"id":"foo", "number":"2000"}, {"id":"bar", "number":"3000"}, {"id":"hoge" "number":"1000"} ]; JSONデータをソートするには、次のsort_by()関数とsortを組み合わせます。 var sort_by = function(field, reve
jQueryを使った一定以上スクロールすると上に固定される横メニュー
最近、上部に固定された横メニューをよく見かけます。最初から一番上にあるものだと最初から「position:fixed」で問題ないと思いますが、最初は一番上にはなく、メニューがページの最上部までスクロールされた時点で固定されるものだとちょっと工夫が必要です。 今回はそんな横メニューをできるだけ親切に解説してみます。 今回のメインはjQueryで固定するところなのですが、一応今回のサンプルで使用したHTMLとCSSも解説します。 HTML よくあるタイプの普通のリストメニューです。 <div id="menu-wrap"> <ul id="menu"> <li><a href="#">メニュー</a></li> <li><a href="#">メニュー</a></li> <li><a href="#">メニュー</a></li> <li><a href="#">メニュー</a></li> <l
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
GitHub - auduno/clmtrackr: Javascript library for precise tracking of facial features via Constrained Local Models
iOS/Androidのブラウザ開いた時に、URLスキームが存在すればアプリ・存在しなければマーケットを開く方法 - Qiita
Bibi | EPUB Reader on your website. — ビビ。EPUB リーダを、あなたのウェブサイトに。
IBM Developer
