Archive of published posts on 2012.1月

!演算子で表示・非表示を切り替える

Posted by specterant on 2012.01.31

This movie requires Flash Player 10.0.22

タイトル通り、グレーの円をクリックすると、水色の四角形が表示したり、非表示になったりします。
/*******************************************
//そんな訳で、表示・非表示を切り替える記述例
*******************************************/
box.visible = !box.visible;
ほんでもって、サンプル作っていたら、躓いたとこがあったのでメモ。
それは、TextFieldを入れたDisplayObjectをボタンにした時、
buttonModeをtrueにしてもTextFieldの部分だけカーソルが変わらないっちゅ〜とこ。
で、ぶち気になったので調べましたでよぉ。
/*******************************************
//そんな訳で、解決法
*******************************************/
button.buttonMode = true;
button.mouseChildren = false;
う〜ん…Mac版Safari5.1.2はカーソル変わらんねぇ〜。
なんででしょうかぁ〜。
わかりません…。後日調べてみます…。

参考サイト
TextFieldを含むSpriteをbuttonMode=trueにしてもカーソルが変わらない (Unknown Quality)
useHandCursor, buttonMode and mouseChildren : maohao:

Read the rest of this post »

No Comments

canvasタグについて

Posted by specterant on 2012.01.27

canvasタグは、HTML5から新しく追加されたタグで、JavaScriptを組み合わせて図形を描画するモノ。
まぁ〜、JavaScript以外のスクリプトでも描画可能なのですが…。
要は、FlashやJavaのようにプラグインがなくても、円とか四角形などが描けるってことっす。

canvasタグは、Internat Explorer9以上、Firefox1.5以上、Opera9以上、Google Chrome、Safariなどでサポートされています。
でも、Internat Explorer6・7・8でも対応させるには、Googleが提供しているExplorerCanvasというJavaScriptライブラリで解決できます。

そんな訳で、ざっくりとした流れと使用例です。

  1. canvasを使うために描画コンテキストを取得する。
  2. getContext()メソッドでcanvasにアクセス。
  3. 色を指定したり、円を描いたりする設定をする。

<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8" />
    <title>canvas Study</title>
    <!--[if IE]><script type="text/javascript" src="./js/excanvas.js"></script><![endif]-->
    <script type="text/javascript">
    onload = function() {
        draw();
    }
    function draw() {
        var canvas = document.getElementById('basic1');
        if (!canvas || !canvas.getContext) {
            return false;
        }
        //canvasを使うための準備(描画コンテキストの取得)
        //getContext()メソッドでcanvasにアクセス
        //現在のところ、getContext()メソッドでは'2d'という引数のみがサポート。
        var context = canvas.getContext('2d');
        context.beginPath(); //図形を描く宣言
        context.moveTo(390, 60); //書き始める座標指定
        context.lineTo(570, 60); //線を描く設定
        context.lineTo(570, 240); //線を描く設定
        context.lineTo(390, 240); //線を描く設定
        context.closePath(); //描いた図形を閉じる設定
 
        //色指定
        context.fillStyle = 'rgb(255,255,255)';
 
        //図形を塗りつぶした状態で描画するメソッド。
        //このメソッドを呼び出さないと、ブラウザ上には表示されない。(他に図形を線で描画するメソッドstroke()もある)
        context.fill();
    }
    </script>
</head>
<body>
<canvas id="basic1" width="960" height="300" style="background-color:#666;">canvasタグをサポートしたブラウザが必要です。</canvas>
</body>
</html>

参考サイト
Canvasリファレンス – HTML5タグリファレンス
Canvas – HTML5.JP

No Comments

Webカメラを使ってみた

Posted by specterant on 2012.01.20

This movie requires Flash Player 10.0.22

とりあえず、Webカメラを使ってみました。
通常、左右反転した状態で表示?されるのですが、それが気になったので下記のように記述し、
鏡に映った状態と同じように表示させてみました。

/********************************
//そんな訳で、反転させる記述例
********************************/
var matrix:Matrix = new Matrix(-1, 0, 0, 1, BitmapData.width, 0);
BitmapData.draw(Video, matrix);

Webカメラを使ってみて、気になった点が…
それは、Webカメラのサイズを設定するCamera.setModeメソッドなんですが、
640×480以上にすると比率が合わなくなった。(4:3の比率の場合)

とりあえず、Webカメラのサイズ設定は、4:3の場合、
640×480以下でってことで覚えときます。

Read the rest of this post »

No Comments

jQueryのattrメソッド

Posted by specterant on 2012.01.16

jQueryを勉強しているのですが、いつもattrメソッドの意味を忘れてしまうので覚え書き。

attrメソッドは、指定した要素の属性や属性値が操作できるモノ。
例えば、aタグのhrefを書き換えることができたりしちゃいます。

/********************************
//書式
********************************/
$('セレクタ').attr('操作したい属性名', '変更後の属性値');

//複数の属性値を同時に操作もできる
$('セレクタ').attr({
 '操作したい属性名1', '変更後の属性値1',
 '操作したい属性名2', '変更後の属性値2',
 '操作したい属性名3', '変更後の属性値3'
});

//属性値を取得したい場合(※変更後の属性値を指定しない。)
$('セレクタ').attr('取得したい属性名');
/********************************
//そんな訳で、記述例
********************************/
$('#div1 a').attr('href', 'http://log.specterant.com/');

/********************************
//HTMLの記述
********************************/
<div id="div1"><a href="http://www.specterant.com/">リンク</a></div>

//jQueryで下記のように変更される。
<div id="div1"><a href="http://log.specterant.com/">リンク</a></div>
Read the rest of this post »

No Comments

はじめます。

Posted by specterant on 2012.01.12

はじめまして。
フリーランスでWebデザイナーをやっている、
SpecterAntです。

HTMLとCSSは、なんとかこなせる程度の野郎です…。
しかし、これではこの業界で生きて行くことは出来ないと思い、
プログラミング技術を習得することを決意しました。
主に、ActionScript、JavaScriptを習得したいです。

そんな訳で、ドメイン取得して、このブログを作りました。
と言っても、テーマを使ってますが…。

…。

まぁ〜、テーマのことは軽くスルーをして、
このブログを使用して、自分用の覚え書きをメインに書いていきます。
ごく稀になると思うのですが、文章書きの練習も兼ねて、
日誌も書いてみたりもしようかなと思っています。

それでは、どうぞ宜しくお願いいたします。

No Comments