Powerful User OnboardingBuilt to Increase AdoptionIntro.js is a lightweight JavaScript library for creating step-by-step and powerful customer onboarding tours

Powerful User OnboardingBuilt to Increase AdoptionIntro.js is a lightweight JavaScript library for creating step-by-step and powerful customer onboarding tours
Webアニメーションの実装方法として海外でいまもっとも話題なのが、anime.jsでしょう。日本の「アニメ」が語源の注目のDOMアニメーションライブラリーの使い方を詳しく。 もし速くて軽いアニメーションのライブラリーを探しているなら、Julian Garnierが考案したanime.jsを検討してみてはどうでしょうか。 この記事は、SVG画像を含む動的なDOMアニメーションに関する解説です。記事では、canvas-WebGLやSVGに特化したアニメーションライブラリーに触れるつもりはありません。ただし、WebページのHTML要素(理想的にはSVG画像も)のアニメーションに適していれば、別の機会に紹介するかもしれません。 記事の目的はライブラリーを分析してコードを掘り下げることではありません。主にCSSを使う人が、DOMのアニメーションのためにJavaScriptでなにができるかを追及する、
どうも、まさとらん(@0310lan)です。 みなさんは、「JavaScriptライブラリ」を活用しているでしょうか? Webサイト制作はもちろんのこと、さまざまなWebアプリやサービスなどを開発する時に、大幅な時間短縮やクオリティを飛躍的にアップすることが出来るようになります。 そこで今回は、国内外で人気が高くて誰でも簡単に扱える「JavaScriptライブラリ」を厳選してご紹介しようと思います! ■多機能な「写真ギャラリー」を組み込めるライブラリ! ◆1.Viewer.js 複数の画像を表示する際に、オシャレな「ギャラリー風」に変換してくれるライブラリです。 類似のライブラリはいくつか存在しますが、「Viewer.js」は使い方が非常にシンプルで扱いやすいのに、多機能性も備えているスグレモノとなっています。 基本的な使い方としては、HTMLファイルに表示させたい画像を「リスト要素」で指
html5j-begin.doorkeeper.jp javascriptの勉強が一通り終わったので、参加してきました! javascriptの勉強会に参加するまでの道のりが長かったぜ...(T_T) 話の内容 4名のJSオジサンからのありがたきお話+質問タイムって感じでした。 一つずつ、つらつら書いていきます(※長文注意ですぞ!) 1.ソースレビューから学ぶ Javascript + 1 株式会社サイバーエージェントの、宗定 洋平さんのお話です。 speakerdeck.com ざっくりまとめると、以下の4点についてのお話でした。 レビューでみているポイント 「バグがない」という言葉の定義 関数名のつけ方 ステップアップするために必要なこと 印象的だったのが...ステップアップするために必要なこと...それは... 「情報処理技術者試験を勉強する」です。 な、なんじゃそりゃー!初耳です。
favico.js v0.3.10 Make use of your favicon with badges, images or videos View on GitHub Try it: +1 -1 Set icon Play video Start webcam Reset Works on Chrome, Firefox, Opera and IE11+ Badges Animate your favicon with animated badges. You can customize type of animation, position, background color and text color.
この投稿は、 JavaScript Advent Calendar 18日目の記事です。 更新履歴 こちら をご覧下さい JavaScript の書き方をアップデートする JavaScript Good Parts で書かれているような JS の書き方は、古くなりつつある部分も多いです。 正直なところ、自分はあの本が「今でも」良書だとは思っていません。 初学者に勧めることもしません。まんべんなさと普遍性と客観性から「パーフェクト JavaScript」 を勧めています。 その頃と比べると、 JavaScript をとりまく環境は変わりました JavaScript の進化に合わせて書き方もアップデートしていくべきなので、今回は分かりやすいしきい値として 「IE10 以下を切れるとしたら」 という前提で、列挙してみます。 たとえば XHR2 や File API に依存したサービスをやる場合な
AngularJS 嫌いな人が多い昨今について 最近 AngularJS 嫌いという言説が多いですが、そういうことを仰る方々は主に先鋭的な JSer のように思います。 ただ、僕なんかの場合には、ユーザー向けの画面の構築などには AngularJS を使って書くことは最近はほとんどなく、JS を書くといえばもっぱら管理画面です。 管理画面の JS を書くにあたっては AngularJS way にのっかってやると非常に楽ですよね。管理画面を書いたりする上では vue-js とかで頑張って書くと見通しが悪くなったりしますし、こった動きなどは必要ないというところで angular.js ワリといいなと思っています。 もっといいものがあれば移りたいですが、コストをかけずに作りやすい管理画面を作るという意味ではやはり AngularJS にまだメリットがあるなあ、と思っています。 2.0 が出た時
ずっと興味はあったし、追っていたんですが手は出せていなかったWebRTCについてやっと学ぶことが出来ました。 ハイパフォーマンス ブラウザネットワーキング ―ネットワークアプリケーションのためのパフォーマンス最適化 作者: Ilya Grigorik,和田祐一郎,株式会社プログラミングシステム社出版社/メーカー: オライリージャパン発売日: 2014/05/16メディア: 大型本この商品を含むブログ (2件) を見る ハイパフォーマンスブラウザネットワーキングという本(以下、HPBN)がありまして、会社の中で輪読会していました。みんなで一つの章を担当しながら話すというスタイルでやっていました。 そこで僕が紹介したWebRTCの話です。 基本的にWebRTCの中でやっていることを深く説明した資料になっています。 HPBNの資料だけで分からなかったところはWebRTCミートアップの資料や先人た
MEANとは、LAMP(Linux, Apache, MySQL, PHP)に変わる技術としてじわじわと注目されはじめているアーキテクチャです。このアーキテクチャMEAN(MongoDB, Express, AngularJS, Node.js)は、シンプルでかつ強力なアーキテクチャで、現在のJavaを利用したアプリケーション開発とは一線を画すところです。HTML5開発にとってJavaの役割が殆どなくなるというのも注目すべき点だと考えます。MEANで一般的に言われる注目すべき事項は次のところです: JavaScriptフルスタックである データモデルとしてクライアントからデータベースに至までJSON そして、この記事を書こうと思ったきっかけですが、2014/10/5(日) Mozilla Open Web Day in Tokyo | Mozilla Japan でのMEAN解説展示で、様
米Microsoftは4月3日、JavaScriptライブラリ「Windows Library for JavaScript(WinJS)」をオープンソースで公開した。元々は「Windows 8」向けに用意したもので、開発者はHTML/CSS/JavaScriptを利用してWebや非Windowsデバイス向けにもWindows風の見栄えを持つアプリケーションを開発できるという。 Windows Library for JavaScript(WinJS)はMicrosoftがWindows 8に向けて作成したライブラリで、Windows Storeアプリを容易にすることを目的に開発された。開発者はHTML、CSS、JavaScriptといったWeb技術を利用しつつ、ネイティブ並みの体験を提供するWindows Runtimeアプリを開発できるという。 ページ制御、データバンディングなどの機能
Marionette.jsのView周りについてを中心にSingle Page Applicationを作るときの話
WebSQL.jsはWeb SQL Databaseを使いやすくするJavaScriptライブラリです。 惜しくもHTML5の仕様からはもれていますが、新しいWebブラウザの機能にWeb SQL Databaseがあります。そんなWeb SQL Databaseをより使いやすくしてくれるライブラリがWebSQL.jsです。 デモです。データを追加したり、削除したりできます。 さらに追加しました。再読み込みしても再現します。 WebSQL.jsはデータベースの作成、テーブルの作成、データのCRUD操作、テーブルの削除が行えます。さらにトランザクションやSQLの実行も可能です。各メソッドはチェーンでつないで実行させることも可能になっています。 WebSQL.jsはJavaScript製、MIT Licenseのオープンソース・ソフトウェアです。 MOONGIFTはこう見る Web SQL Da
こんにちは。デザイナーのハルエです。 最近ちょくちょくグラフを用いた制作物に関わることがあり、案件によってはエンジニアさんにお願いしたりIllustratorのグラフツールで作ったりしていたのですが、なんやかんやで時間とられちゃうんですよね。で、もっとこうオシャレでスマートにさくっとハイテンションで作れるものはないかと探してみました。 そこで見つけたのがこれ。「Chart.js」。 めちゃくちゃ愛くるしい動きをしてくれます。デザインもフラットでいい! ポートフォリオやプレゼンなんかにもきっと役立ちますよ。 Chart.jsとは? 折れ線グラフ、棒グラフ、円グラフ、レーダーチャートなど、6種類のグラフが簡単に描けてしまうJavascriptのライブラリです。 HTML5のCanvasを使って描画され、表示の際の気持ちいいアニメーションの動きが特徴的です。とても分かりやすいマークアップなので、
項目説明: delimiter – テンプレートを書く際の区切り文字 ({{}} や <%%>) が変更できる。 logic-less – テンプレート上で演算や複雑な制御構文が書けない仕様により、ロジックとテンプレートが完全に分離される。 precompile – テンプレートを事前に実行可能な JavaScript のコードにコンパイルできる。 escape – テンプレートエンジンで自動的に HTML エスケープができる。 method – テンプレート上からデータとして与えられたメソッドを呼び出し、結果を挿入することができる。 standalone – テンプレートエンジンが別途ライブラリを必要とせず単独で動く。 partials – 部分的に別のテンプレートファイルを組み込むことができる。 (include のようなもの) 上の表で表現しきれないそれぞれのテンプレートエンジンの特
Speak.jsはJavaScriptだけでテキストを読み上げるソフトウェアです。 Webブラウザで音声ファイルを指定してJavaScriptで解析、なんてソフトウェアもありますが今回は一から“音声”を生み出してしまう驚きのソフトウェア、Speak.jsを紹介します。 ボタンを押すとHello Worldと話します。 こんな感じで任意の言葉を話させることもできます。 Speak.jsはジェネレータを通じて音声を動的に生み出します。対応しているのは英数字のみとなっており、日本語には対応していません。常に動的に生成しているので自由なテキストを読み上げさせることができます。 Speak.jsはJavaScript製のオープンソース・ソフトウェア(GPL)です。 MOONGIFTはこう見る テキストを外部サーバに送って、それを音声ファイルにして返すAPIも世の中にはあります。当然、こちらの方が英語
GithubでJavaScriptのコードとして分類されており、現時点でwatch数の多い200件の中で、実際に使ったことがあり便利または面白いと感じた20件をまとめてみました。 backbone-boilerplate、requirejs、yeoman、lodashのような定番になってきているものから、TimelineJSのような全く汎用性のないものまであります。 d3.js Data-Driven Documents。サンプル集を観るのが手っ取り早いと思います。 pdf.js JavaScriptだけでPDFをレンダリングできる時代です。1年半ほど前にくらべると、かなりPDF製作者の期待通りにレンダリングできるようになってきています。 backbone-boilerplate Backbone.jsを使ったアプリの骨格構造。サーバー側でいわゆるMVC2のアプリを作っている人にはB
GAのクッキーって結構複雑で扱いにくいんですが、それをJSから簡単に取得できるようにしてみました。GAを使っているサイトのユーザーで、GAのクッキーを持っていればだいたい使えます。 ga.utils.jsです。 これは何 以下の情報を取得できます: ・ユーザーがリピーターか否か ・何回目の訪問か(セッション数) ・前回の訪問から何日経ったか ・今回のセッションで何ページ閲覧しているか ・cookie内のトラフィックキャンペーン ・cookie内のトラフィックメディア ・cookie内のトラフィックソース 使い方 使い方は簡単です。上記リンクからJSをダウンロードして、サイトで読み込んでください(headでもbodyでも)。その後、取得したい情報に応じてJSを呼び出します。 <script type="text/javascript"src="ga.utils.js" charset="ut
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く