イナヅマTVログ

2013.01.26
09:05
author: taikiken
0件のコメント

[JavaScript] mousedown > mouseupとclickで違うことしたい

わかりにくいかもだけど…
同じDOMElementでマウスアップとクリックを判別し処理分岐をしたいことがありました。

【click】
mousedown -> mouseup の間隔が短い。

【mouseup】
mousedown -> mouseup の間隔が長い。
長押し後のマウスアップ。

マウスを「カチッ」と「ジーーーーーーーカチッ」で処理を分岐させるためのメモ。

続きを読む →

2013.01.25
01:20
author: taikiken
1件のコメント

[JavaScript] Function.prototype.callとFunction.prototype.applyとか

JavaScriptでClassもどきの継承したときに apply を使ってたけど、three.js は call を使っていてどう違うのか気になったので調べてみました。

MDN

Function.prototype.call
Function.prototype.apply

MDNによれば引数の形式が違うだけらしい。
続きを読む →

2013.01.24
23:52
author: taikiken
0件のコメント

Flex Mobile Project, 画面密度(DPI)にあわせてactionBarの高さを求める

Flex モバイルプロジェクト(MXML)でアクション・バーの高さを求める計算式メモ。

プロジェクト設定時に「画面密度に合わせてアプリケーションを自動サイズ変更」にチェック。

var ratio:Number = Capabilities.screenDPI / applicationDPI;
var actionBarHeight:Number = navigator.actionBar.height * ratio;

これで、DPIに合わせて高さが変更される”actionBar”の高さが求められる。

【参考】
help.adobe.com : モバイルアプリケーションでの複数のスクリーンサイズと DPI 値のサポート

2013.01.24
09:17
author: taikiken
0件のコメント

[JavaScript] Object.createが使えない時の継承方法

ECMAScript 5のObject.createを使うと継承ができます。
[JavaScript]ECMAScript 5限定、継承にObject.createを使う

ECMAScript 5が使えない時の継承方法。

var extend = (function () {
    var F = function (){};
    return function (P, C) {
        F.prototype = P.prototype;
        C.prototype = new F();
        C.mama = P.prototype;
        C.prototype.constructor = C;
    };
}());
 
// Parent Class
function Parent (x) {
    this.x = x;
}
 
// Child Class
function Child (x) {
    Parent.apply(this, arguments);
}
// 継承
extend(Parent, Child);

引数の順番や関数名や変数名は変えていますが、Scriptは「JavaScriptパターン-―優れたアプリケーションのための作法」に載っているものです。

「JavaScriptパターン」は私には少々難解すぎるのですが参考になることが多く、良い本だなーと思います。
JavaScriptで込み入ったサイトを作ったり、大規模開発を行う必要がある方にはおすすめです。

2013.01.18
10:05
author: taikiken
1件のコメント

[JavaScript] ECMAScript 5限定、継承にObject.createを使う

ECMAScript 5限定だけど継承に使えるObject.createいいね!

/**
 *
 * @param P {Function} Parent
 * @param C {Function} Child
 */
function extend (P, C) {
    C.prototype = Object.create(P.prototype);
    C.prototype.constructor = C;
}
 
// Parent Class
function Parent (x) {
    this.x = x;
}
 
// Child Class
function Child (x) {
    Parent.apply(this, arguments);
}
// 継承
extend(Parent, Child);

2013.01.17
00:56
author: taikiken
2件のコメント

[JavaScript]デフォルト引数の設定方法って難しい

2013年はthree.jsで始まりました。
WebGL だけでなくDOMElementやCanvas 2Dにも対応している懐の広いライブラリです。
リビジョンごとにClassが追加されたり削除されたり移動したりAPIが変わるのは難ありですけど、この多機能さはあり得ないほど助かります。

今回はthree.jsでも多用されているデフォルト引数の話です。

JavaScriptにはデフォルト引数の機能はありません。
ありませんが、設定したくなることがあります。
続きを読む →

2013.01.08
02:09
author: taikiken
1件のコメント

[JavaScript] 条件判定には===, !==を使いましょ

JavaScriptしてますか。

2013年もJavaScriptな毎日が始まりました。
まっさらなプロジェクトで自分中心だとプレッシャーは大きいけどやりがいがあったりします。

共同で作業するのも刺激があって好きです。

今回は判定についてです。
条件分岐はScriptにつきものです、この条件の時にはああして、そうじゃなかったらこうして、と多くの局面で使われます。

判定条件の使い方を間違えると思いもよらない結果を招きます。
続きを読む →

2012.12.21
04:06
author: taikiken
0件のコメント

IE 8以下のレガシーブラウザでもHTML5な時のおまじない

*2011-11の下書き記事を公開しました。
Webの世界もHTML5な時代になるのでしょうか。

HTML 5でコーディングするのは構わないんですけど、ほらほら厄介なお子達がいますよね、IE 8とかIE 7とかIE 6さん達が。
なかなかサイト制作レギュレーションから外れてくれないこの子達はHTML5には非対応です。
HTML5で新規追加されたタグは全く理解できません。

<section>
<article>
<aside>
<hgroup>
<header>
<footer>
<nav>

ブラウザの仕様は未知のタグが登場したら無視します。
知らん顔されて無いことになっちゃうんですねぇ、それは困る。

それで世の中にはなんとかしてあげようって人たちが色々とライブラリ(JavaScript, CSS)や情報を提供してくれています。

html5 Doctor
http://html5doctor.com/
なんたってDoctorですから安心しておまかせできそうです。
HTML5で調べたいことがあれば利用しています。

HTML5 Reset
http://html5reset.org/
こちらのHTMLソースコードが色々と参考になります。

と、1年前に書きかけて下書きのままでした。
この後何を書こうとしてたのか今となっては謎です。

ゴミ情報だけど公開しちゃおうっと。

2012.12.21
03:50
author: taikiken
1件のコメント

[JavaScript]あれっ、IEはCross DomainだとXMLがとれない?とれない!

JavaScriptでドメインを超えてXMLを取得しようとしています。
出力側でAccess-Control-Allow-Origin対策のためにheaderを追加しています。
Ajax, jQueryでXMLをParseそしてAccess-Control-Allow-Originについて

header("Access-Control-Allow-Origin: *");

続きを読む →

2012.12.20
03:19
author: taikiken
0件のコメント

[JavaScript] IE 7以下でaタグhrefをJSで取得するとホスト付き

つまらないことで、がっつりハマったのでメモしとく。

<a href="#example" id="exampleLink">

HTMLのaタグのhref情報を取得しようとしています。

jQueryを使用しています。

$('#exampleLink').attr('href');

IE 8以上、Chrome, Safari, Firefoxなどのモダンブラウザは
#example
が返ってきました。

IE 7, IE 6では
http://example.com/#example
とプロトコル+ホスト付きで情報が返ってきました。

1年前のコードを書いてた時には知ってたみたいなのに、身に付いてないのですっかりハマってしまいました。
去年の自分はいけてたのになんという時間の無駄使いをしてしまったのだろう。

戒めのためにブログっときます。