ECMAScript 5 時代のオブジェクト・プロトタイプ継承入門
2012 年 11 月 29 日の Kyoto.js #2 で発表しました。 「一応 JavaScript を使ってプログラムを書けるが、プロトタイプ継承とかそこらへんの細かいことはちゃんとは理解していない」 というぐらいの初心者向けの発表のつもりでした。 でも実際はあまり初心者向けって感じではないですね。 JavaScript のプロトタイプ継承の説明をするために new 演算子とコンストラクタを使うことが多い気がしますが、Object.create 関数を使って説明した方がわかりやすいのではないか、ということでそういう説明をしてみようというのがこの発表を行った動機です。 ブログ記事 : http://vividcode.hatenablog.com/entry/study-meeting/kyotojs-2-es5-obj-intro
touch, click, pointerの実装 | 前編 タッチイベントとマウスイベント
touch, click, pointerの実装 前編 タッチイベントとマウスイベント このシリーズでは、タッチ／マウスイベント系の実装を考えます。第1回目はタッチイベントとはなにか、また、タッチイベントとマウスイベントの判別について解説します。 はじめに iPhone、Androidが登場したのはもう何年も前ですが、さらにWindows8も登場し、いろいろと状況が変化してきました。Windows8を搭載したPCの多くはタブレットデバイスのように、画面に触れることができるようになっています。 しかしながら、これらのデバイスはマウスを使っても操作できるようにもなっています。今後、どのようにタッチ／マウスのイベントを扱っていけばよいのかは、これからのウェブ開発において、より重要になっていくはずです。 そこでこのシリーズでは、タッチ／マウスイベント系のブラウザへの実装を整理し、それらのブラウザに
Array.prototype.slice.call(arguments)とは - console.lealog();
Array.prototype.slice.call(arguments); っていう、いかにもJavaScriptを使いこなしている風なこの書き方。 もちろん最初はまったく意味がわからんかったです。 そして次に、意味はわかっても、使い道がわからんかったです。 けど最近、使い道がやっと見えてきました。 というわけで、その過程をメモ。 arguments ざっくり引数のこと。 var func1 = function(name, arg1, arg2) { console.log(arguments); // ["Test", 100, 200] }; var func2 = function(name) { console.log(arguments); // ["Test2", true, function] }; func1('Test', 100, 200); func2('Test
お絵描きアプリと画像の保存処理の実装
<!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, height=device-height, initial-scale=1, maximum-scale=1, user-scalable=no"> <script src="components/loader.js"></script> <link rel="stylesheet" href="components/loader.css"> <link rel="stylesheet" href="style.css"> <script> window.addEventListener('load',onLoad,false); function onLoad() { var wid
Googleも推奨！アニメーションライブラリTweenMaxの使い方 入門編 — un-Tech
ごきげんよう。フーミンです。 「JavaScriptでアニメーション作るならTweenMaxが最強だよ」と先輩から教わり早2年。いまだ現役最強（僕の中で）JavaScriptアニメーションライブラリTweenMaxの良さを広めるために、入門編・応用編の全2回に分けてご紹介しようと思います。 TweenMaxとは TweenMaxとは、GreenSock社が開発した超高性能アニメーションプラットフォーム「GSAP」のひとつで、DOMアニメーションに特化したJavaScriptライブラリです。 requestAnimationFrameを使用しているため、jQueryのanimateメソッドを使うより、動作が高速かつ安定しています。 同じようなライブラリにmokichiくんが紹介してくれたVelocity.jsというのもあります。 TweenMaxと同様に動作が高速かつ安定しており、jQuer
D3をはじめよう
データ可視化のために作成されたJavaScriptベースのツールキット、「D3.js」の概説書です。D3の基礎となる、データセットの文脈によってコンテンツの要素を取扱う方法を学びます。ニューヨーク都市交通公社（MTA）の公開している実データに基づいて、HTML、Canvas、SVGを使った、豊富でグラフィカルなビジュアライゼーションの方法を知ることができるでしょう。なお本書はEbookのみの販売となります。 まえがき 1章 はじめに D3 基本設定 ニューヨーク都市交通公社のデータセット 2章 Enterセレクション シンプルな地下鉄路線状況表示盤を作成する プラザの1日平均交通量のグラフを作成する 3章 スケールと座標軸と折れ線グラフ バスの故障、衝突や人身事故 回転式ゲートの交通量をグラフ化する 4章 インタラクションとトランザクション 地下鉄の定時運行率の評価UIその1――インタラク
JavaScriptを使ってSVGでグラフを描く·Morris.js MOONGIFT
Morris.jsはjQueryを使ったSVG描画型のグラフライブラリです。 Webブラウザ上でグラフを描画しようと思ったら従来はサーバサイドの仕組みかFlashを使うのが一般的でした。しかし今後はJavaScriptが便利です。Morris.jsはjQueryを使ったグラフライブラリです。 二つのデータがある折れ線グラフ。 棒グラフ。 エリアグラフ。 パイチャート。 今のところ対応しているのは折れ線、棒、エリア、ドーナッツチャートになっています。それぞれ豊富なオプションが用意されています。また、マウスオーバーで値をフローティング表示してくれるのも便利です。データはJavaScriptで与えますが、グラフはSVGで出力される仕組みになっています。 Morris.jsはjQuery/JavaScript製、BSD Licenseのオープンソース・ソフトウェアです。 MOONGIFTはこう見る
Rainbow - Javascript Code Syntax Highlighting
Download Select what languages you want to include to build a custom package. Languages select all C C# Coffeescript CSS D Generic patterns Go Haskell HTML Java JavaScript JSON Lua PHP Python R Ruby Scheme Shell Smalltalk SQL CSS themes are available on GitHub. Download What is this? Rainbow is a code syntax highlighting library written in Javascript. It was designed to be lightweight (2.5kb), eas
テキストエリアでタグのハイライトや自動補完·TAGMATE! MOONGIFT
TAGMATE!はTwitterやFacebookのテキストエリアのように#@$という接頭文字に対応してタグ化するライブラリです。 TwitterやFacebookによってテキストエリアの中に特定の記号を伴った文字を書くとそれがユーザやタグとして認識されるサービスが多くなっています。そこで類似の実装をする際に使えるのがTAGMATE!です。 #、@、$の後に書かれた文字列が自動的にタグとして認識されてハイライト表示されています。 @の場合は本名での補完機能がついています。 $は金額に反応します。 名前のタグだけ抽出できます。この時はユーザ名なのが面白いです。 同様にハッシュタグだけ抽出。 プライスタグはうまくアラートが出ませんでした。 全てのタグを抽出しました。 TAGMATE!は@#$のタグに対応しています。パースする条件は正規表現で指定できます。インラインのオートコンプリートにも対応し
Node.js のエラーハンドリング - 2011-12-13 - 日記
JavaScript Advent Calendar 2011 (Node.js/WebSocketsコース) の 13 日目の記事です． Node といえば非同期プログラミングですが，そのスタイルは大雑把にわけて 2 種類あります．一つ目は fs モジュールなどで使われているコールバック関数のスタイル． fs.readFile(path, function(err, content) { if (err) { // エラー時の処理 return; } // 成功時の処理 });このスタイルは，何らかの要求に対する結果を一発で受け取る (要求と結果が 1 対 1) 場合に使われます．そして，コールバック関数の第1引数でエラーの有無が通知されます．エラーがなければ null，エラーがあった場合は Error オブジェクトというのが原則のような気がしますが，undefined が渡されたりする
CSSとJavaScriptで文章をメモ書き風に
または和文フォントから仮名部分のみ抜き出してサブセット化したものとYahoo! Japanのルビ振りAPIを組み合わせて、ユーザー環境やサーバー性能に左右されずに比較的自由なフォント表現を行うためのイロハ。おれ ここ めも かき なぐる！ Demo: Scribble My Tweet #3 フォントのサブセット化 ここでいうサブセット化とはつまりフォントから必要な部分のみ抜き出して再構築すること。Webフォントとして使えるからといって、サブセット化までは許されていないことがあったりするので、それには気をつける必要がある。例として新BSDライセンスで提供されている、きろ字 プロポーショナルを取り上げる。 サブセット化に留まらないWebフォントのジェネレーターとしてFont Squirrelの@font-face Generatorが利用できるが、アップロードするフォントのサイズ制限が厳しい
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
jQuery .mouseenter() / .mouseleave() と .mouseover() / .mouseout() の違い
Epoch by Fastly
Regexper
slot gacor deposit pulsa tanpa potongan
GitHub - ccampbell/rainbow: Simple syntax highlighting library written in javascript
Interactive charting library | Highcharts
Rocketcharts.com is for sale | HugeDomains