DOM要素を生成する [ javascript / jQuery ]

知らなかった。
HTMLタグから要素を作りたい時、これで良かったんだ。 
$('<table>')

ずっと、

$('<table></table>')

て書いてコードが無用に長くなって嫌だなあ、と思ってました。
サンプルだけじゃなく人のコードも読まんといかんねえ。

javascript - めんどうな作業がわずか1クリックに!新人プログラマーが知らないと一生後悔するブラウザーを使ったHTML生成
いいえ、使いません。
めんどうな作業がわずか数秒に！新人デザイナーが 知らないと一生後悔するExcelを使ったHTML生成 | Webロケッツマガジン
僕たちプログラマーは、ちょっとしたコード生成に、Excelを使います！

僕たちプログラマーは、ちょっとしたHTML生成にDHTMLを使います。

同じ「プログラマー」という言葉だけど、それぞれが違う人種のことをさしているんじゃないかと思いつつ、どちらもいい方法だなあと思いました。

手元にExcelしかなくて一回きりの作業ならExcelを使うし、コレから何回もやる作業なら簡単にコードくんだ方がいいですよねー。

0 コメント
ラベル: ,

Firefox7以前の版ではlocalStorageをローカルファイルでは使えない [ javascript ]

そういうことだったのか！

そりゃFirebugを入れてトレースしてみてもさっぱりわからんはずだ。

ちょっとしたツールを作っていて、どうしてもFirefoxだけ保存したつもりのデータが読み出せないことを発見。

どうしてだろう、何かブラウザ依存なことをやっているんじゃなかろうかと、小一時間くらい悩んだ挙句に放置したんですよね。。

作ってたツール自体はChromeやOperaでは意図通りにデータを保存してくれることだし、特に困らないので忘れかけていたところに、FirefoxでlocalStorageを使う記事を発見。

続きを読む »
0 コメント
ラベル:

jQuery1.7 [ jQuery ]

お、jQuery1.7がリリースされたとな。

JQUERY 1.7 RELEASED
jQuery 1.7 is ready for download! You can get the code from the jQuery CDN:

新しい機能を使う予定は特に無いけど、また一段と速くなったらしいので早々に取り込んでおきたいな。少しづつ大きく（サイズ的にも機能的にも）なっていくのは宿命かなあ…

続きを読む »
0 コメント
ラベル:

IMG.complete属性で画像の読み込み状態を確認する [ javascript ]

画像が読み込めたか、読み込みに失敗したか。

これを知るのに、onloadとonerrorで察知する方向でスクリプト書いていたら、時々どちらにも引っかからないのに画像が表示されることがある。

何がしたかったかというと、テキトウに作ったページに埋め込んだ、まともに管理してないおかげで使ってるの忘れて消してしまったりしてちゃんとロードできなかったときに、ロードできなかった画像を非表示にしてなかったことにするスクリプトを書こうとした。

続きを読む »
0 コメント
ラベル:

JavaScriptは「勉強しなくてもOK」な言語なのか？ [ javascript ]

勉強しなくてもOK？

それは素晴らしい！

うん。勉強（努力）しないで使えるならそれに越したこと無いよなあ。

テキストエディタとブラウザがあればどこでもプログラムが組める、というのがJavaScriptのいいところだと思う。テキトウに組んでもそれなりに動くことにかなり救われている面もあるだろうなあ、きっと。

『パーフェクトJavaScript 』――JavaScriptは「勉強しなくてもOK」な言語なのか？

　前世紀、JavaScriptは「ホームページのおまけ」として使われる言語だった。
……
　あれから十余年。今やJavaScriptはどこにでもある。Webアプリケーションの中核的な動作を担っていることだって少なくない。WebブラウザでJavaScriptをOffにする？ あのWebサイトもこのSNSも、まったく閲覧できないじゃないか！

ていうか深く掘り下げないで使える程度で満足できるのなら、それはそれでいいんじゃないですか？

■「みんな勉強しなくてもできると思ってる唯一の言語だよね」？

　一方、著名なJavaScriptプログラマのDouglas Crockford氏は、こんな恐ろしくも的確な発言をしている。

JavaScript is the only language that people think they can program without actually learning it.

　え、日本語で？ OK、筆者の同僚による日本語訳を紹介しよう。

JavaScript はみんな勉強しなくてもできると思ってる唯一の言語だよね、HAHA

　日本語訳でも恐ろしい。何が恐ろしいって、冗談ではなく一定の真実を含んでいるところが恐ろしい。jQueryとプラグインを導入してちょっとハデめのUIが動いてしまうと、それだけで「JavaScriptプログラミングをした！」と思ってしまう層が、確かに存在するからだ。

Douglas CrockfordさんってJSONの発見者だったっけ。

思ってることが本人や周りの人にとって非常に迷惑になる、という話なのかな？

…ああ、JavaScriptで初めてプログラミングに触れて、『jQueryとプラグインを導入してちょっとハデめのUIが動いてしまうと、それだけで「JavaScriptプログラミングをした！」と思ってしまう』という勘違いをしてプログラマーを気取ってしまうとどえらく恥ずかしいかも知れない。うん。

個人的にはJavaScriptをはじめとした軽量プログラミング言語の 『裏を返せばいくらでも「ゆるふわ」コードや「カオス」コードを書くことができてしまう。』というところは大好きだけど、そこだけの知識でプロを気取ってしまった人を相手に仕事をしたいと思わないのもまた確か。

勉強という言葉からは、嫌いなことを必死で「くそまじめに」やる、という印象を受けてしまうから『勉強しなくていい』がステキに感じるのですね、きっと。好きな事を習得するのは自分の中では『勉強』という言葉は使わない。プログラミングを『勉強』する人って、それが『勉強』だと認識する時点できっと楽しくないよね…まあ世の中好きなことをやってそれで生きていける人は少ないわけで、今一線で活躍するプログラマであろうとすると『勉強』しなくちゃいかんと思うと、プログラミングが嫌いになりそうで嫌だなあ。

と、書評を読んでとりとめもないことを考えてしまいましたとさ。

0 コメント
ラベル:

マウスが重なったときに画像のサイズを変える [ html / javascript ]

画像をはじめからでかでかと表示するのはいやなんだけど、必要に応じて拡大したい。

そんな希望を実現する方法で、簡単に埋め込めるのでお気に入りだったやり方を思い出したので忘れないうちに備忘録。

imgタグのonmouseoverとonmouseoutに直に簡単に仕込むだけ。エフェクトとかなくて味気ないけどライブラリも別のスクリプトも不要。スクリプトタグを跳ねるようになっているブログでもこのくらいなら使える可能性高いのではなかろうか。

続きを読む »
0 コメント
ラベル: ,

MapsGL - GoogleマップのWebGL対応版 [ WebGL ]

誘われたら試したくなるのが人情。
続きを読む »
0 コメント
ラベル:

テキスト行を結合する [ javascript ]

ふとテキスト中の改行を削除して一行に結合するコードを作りたい、と思ったのがきっかけ。
通常ならStringのreplaceを使うことしか思いつかないのに、たまたまどこかのサイトでsplitとjoinを使って文字列を置換する方法を見ていたのでどっちでやるのがいいのか気になって比べて見ることにした。

replaceを使う:

文字列.replace(/\n/g, "")

split & joinを使う:

文字列.split("\n").join("")

『正規表現って何か遅そうだからsplit&joinを使うほうがクールで速い』が一般論として成り立つんじゃないかと思って性能を測ってみたけど、ブラウザによってまちまちな模様。

手元のパソコンでのテキトーな測定結果（1秒間に何回変換出来たか）：

Chrome15Opera11Firefox7IE10
split&join 436753 305781304930 146187
replace923907 341391271214 189233

どちらがいいとも言えない結果になってしまった。replace侮りがたし。Orz

一番いいところを取るならreplaceなんだろうな。split&joinが勝ってるケースでは差はあまり大きくないことだし。

それにしてもChrome他のブラウザをぶっちぎって速いな！これを基準にしてると他の環境で実行したときにハマりそうで怖いくらいだ。

あと…ええと…もちろん、一面を評価したに過ぎないですけど…もうちょっと頑張って欲しい＞IE

続きを読む »
0 コメント
ラベル:

Dart Webアプリケーションの開発を想定したプログラミング言語 [ Dart ]

Perlは大好きだけど、実際にシビれたのは少し使ってみた後でした。
Pathologically Eclectic Rubbish Lister（病的折衷主義のがらくた出力機）の略という説を聞いてますます大好きになったので、先にこの略を聞いていたら、使ってみる前からワクワクしたかも知れない。

新しいプログラミング言語。
そう聞いただけでワクワクしなくなったのはいつからかな。
Cにはワクワクしました。主に、失敗はプログラマに跳ね返る、超硬派なプログラミング言語である、という点に。

でもC++等の派生物にはワクワク感が無い。
Javaにもなかったなあ。
Javascriptも、ブラウザとテキストエディタだけあればコード組んで遊べるから、という理由で使ってみてからシビれたんだものね。。

あ、Dはちょっとワクワクしたかも。使ってみる機会が無いのでシビれてないけど。

そしてまた一つワクワクしない言語が発表されたようで。
Dart : Structured web programmingグーグル、新言語「Dart」を発表。JavaScriptのようなWebプログラミングを想定
グーグルは10月10日、予想されていた通り新言語「Dart」を発表しました。

DartはWebアプリケーションの開発を想定したプログラミング言語。実行方法として、JavaScriptに変換してWebブラウザ上で実行する方法と、専用の仮想マシンを搭載したWebブラウザで実行する方法が予定されています。グーグルはChromeにDartの仮想マシンを搭載する計画を検討中であることを明らかにしています。 Dartの設計方針は次のように説明されています。
「Dart : Structured web programming」のサンプルを見ても、これで何がどうJavascriptよりいいのか分からないもうろくした感じの今日この頃…

確かに名前がJavaと紛らわくないという一点においては、無条件にJavascriptより優れていると言わざるを得ない。
他はツールを作りたい人たちを除いてなにかメリットがあるのかしらん。

構文がCっぽくて、静的なクラスだのインスタンスだの継承だのそんなのでプログラムを作りたいのなら、Javaでいいんじゃないの？個人的には嫌いだけど、大規模な開発にはむいてるんでしょ？今でもJavaアプレットって動くんだよね…：ｐ

うまく広まれば、ブラウザとテキストエディタだけあればプログラムが組める言語の選択肢が増える、というのはいいところかも。
実際に使ってみたらシビれるところが分かるかな。
0 コメント
ラベル:

テーブルの列幅を均等にする [ CSS / html ]

ポイント

  • スタイルシートで「table-layou」tプロパティを「fixed」に設定。
  • テーブルの横幅を指定する。（横幅を指定しなくてもテキトウに揃えてくれればいいのになあ）
続きを読む »
0 コメント
ラベル: ,

$のイディオム [ javascript ]

jQueryが便利だなーと思い始めた頃のある日、どこかのサイトで、

jQuery(function($){....})
と書いておけば、$を確実に使える

というのを見たことがある。

表面上の意味はわかるが意義が分からん（つまり良くわかってない）のでそのまま流したてたんだけど、その後、 

var $ = function (id) {return document.getElementById(id)}
：
：
：
$("hogehoge").innerHTML = .....;

なんて使い方をしてあるコードを幾つか立て続けに見かけた。

続きを読む »
0 コメント
ラベル:

ネイティヴクライアント機能を動かしてみる [ html / javascript ]


Technical Overview - Native Client SDK - Google Code

Native Clientの部分が塩(NaCl)で、そのインターフェイスになるのが胡椒(Pepper)ですか。

するとHTMLやJavascriptでの部分がステーキ？ハンバーグ？

Javaとかでネイティヴコードを実行するときと印象は似てる。そら違う世界を繋ぐ様子を図に書いたら似てくるかもしれないなあ。

こんなことやる間にもっともっとV8エンジンのチューニング頑張ってくれればいいのに、とか勝手なことを思ってたけど、チャート見ているとなんとなく動かしてみたくなってしまった。

Chromeのバージョンは…うん大丈夫。ちゃんと14以上にアップグレードされている。

次は「about:flags」。

あったあった。

やっぱりここでネイティヴクライアント機能の有効無効を設定するんだ。

そうじゃないかと思ったけどやっぱりデフォルトは無効になっている。

ネイティヴクライアント機能を有効にしてChromeを再起動、と。

ネイティブ クライアント
ネイティブ クライアントに対応できるようにします。
有効にする

んでもってサンプルページからデモを実行、と。

続きを読む »
0 コメント
ラベル: ,

テキストエリアの変更可・不可設定 [ javascript ]

テキストエリアの「readOnly」というプロパティの真偽値で制御できる。
が、意外と気づかないもので…
誤: textArea.readonly = true; // テキストエリアを変更不可にする

正: textArea.readOnly = true; // テキストエリアを変更不可にする
エラーが出るわけでもなく、ただ狙った効果が得られないだけ。そりゃそうだよな、単に違うプロパティとして扱われているだけだもの。
HTML中では大文字でも小文字でもいける場合が多いのに油断してたOrz
1 コメント
ラベル:

IE9の互換モードがうまく制御できない… [ IE ]

がるるるるるる。 IE9ならそこそこテキトウにCSS3とか使っても普通に表示されるだろうと期待したのに。なんじゃこの惨憺たる表示は…
続きを読む »
0 コメント
ラベル:

Bloggerの記事を$.getJSONで取り出す [ jQuery ]

どこかの見よう見真似だが、とりあえず使える。

Show source


補足

以前日本語で開設されてたサイトを見ながら見よう見真似で作ったスクリプトだけが手元に残っている状態。なぜか以前のサイトには到達できないのでいろいろメモしておこうかと思う。

URLに以下のような引数を埋め込むことでbloggerからJSONP形式でのデータ取得ができる。自分のブログに記事一覧とか置くだけならば、クロスドメインにもならないので普通にJSONでいいような気もする。

ベースURLhttp://tip-tips-tipsss.blogspot.com/feeds/posts/defaultアンダーラインの部分(tip-tips-tipsss.blogspot.com)をターゲットにするブログのアドレスにする。
引数 start-index取得開始記事番号最新記事が1。数字が大きくなると古くなる。
引数 max-results取得記事の最大数指定した記事より少なければ、少ない量の記事が帰ってくる。
引数 redirectひとまずfalse…何だったっけ？フィードをリダイレクトしているときには、リダイレクトしないことを指定するんだったかな？
引数 alt「json-in-script」でJSONP形式での送信希望
引数 callbackコールバック関数を指定$.getJSONを使うときには、callback=?としておく

getJSONの第2引数としてこんなふうに記述できるのが簡潔で、かつ、必要なURIエンコードとかもjQueryがやってくれたりするので楽ちんなのだが…

{
    "alt":         "json-in-script",
    "redirect":    false,
    "start-index": 1,
    "max-results": 10
}

なんか事のついでにjQueryが勝手に（？）追加する引数が、blogger側のお気に召さないらしくエラーが返されてしまう。

余計なパラメータを取る方法がよく分かんなかったので、仕方なくURLに全部突っ込んだ。Orz

続きを読む »
0 コメント
ラベル:

resize ウィンドウのリサイズイベント [ jQuery ]

とりあえずメモ。

専用のresizeというイベントが用意されているらしい。

形式

$(window).resize(コールバック関数)

もしくは、

$(window).bind('resize', コールバック関数)

ノート

  • ピクセル単位で動的に要素をレイアウトするコードを書いたはいいが、ブラウザウィンドウの大きさを変えると配置がいまいちになるのが悲しい。
  • 悲しさを解消するために、要素の形状が変わった時にもレイアウトコードを呼び出したい。是非。
  • changeイベントハンドラを設定すれば取れるのかな？
  • 残念、changeはテキスト等の中身が変わったことを検出するだけで、形状はノーケア。
  • 要素の大きさ変更を通知してくれるような標準イベントはなさげ
  • ウィンドウでもいいか？まあ目的は果たせるのでよしとするか。
0 コメント
ラベル:

Node.js楽しそう [ javascript ]

サーバサイドでJavascriptを使う理由ですよね。
そんなに一生懸命になって理由を探さなくても、そうできたら面白そうだから、じゃダメかな？

何かを作らなければならないとき、Java以外の選択肢中にjavascriptがあるならそれだけで十分な理由だと思いますが。(Javaを好む人達の話があまり好きになれなくて、そのおかげでJavaもあんまり好きでは…)

『実践JSサーバサイドJavaScript入門』――あえてサーバサイドでJavaScriptを使う意義を探る
　JavaScriptを使う理由はただ1つ、他に選択肢がないからだ。JavaScriptは、Webブラウザで動く唯一の言語である。FlashやJavaアプレットでもWebブラウザからプログラムを動かせるが、JavaScriptとは根本的に違う。… …JavaScriptの持つ真の力を出せるアプリケーションを作るには相当な力量を要求されることになるだろう。あらためて思う。サーバサイドJavaScriptよりもJavaScriptの方が難解だ。 …いつの日か、このじゃじゃ馬のような言語を乗りこなしてみたい。

クライアントサイドの方が触ってて楽しいと思ってたけど、Node.jsの簡単な紹介を読んで、サーバサイドのコードを設計したり書いたりするのも楽しそうだと初めて思ったよ。

Node.jsとは何か、開発者ライアン・ダール氏が語る（前編）～ノンブロッキングとはどういうことか？
いま注目されているサーバサイドJavaScriptの火付け役となったNode.js。その開発者であるライアン・ダール（Ryan Dahl）氏自身がNode.jsを紹介した講演「Introduction to Node.js with Ryan Dahl 」のビデオが公開されています。… 　Node.jsを触ってみよう。今日は特にスライドは用意してなくて、タイプしてどんなものかを動かしながら紹介していくつもりだ（注：ダール氏はここで最初に「ノードジェーエス」（Node.js）と言った後は、ずっと「ノード」（Node）で通しています）。…

コンソールの上で簡単に紹介されるプログラミング。
ただ、こんなふうに書いていけばこんなことが出来る、という一見地味なこれ。
久しぶりになんとなくワクワクするコードが書けそう、なんて思ったの何年ぶりかな。
プログラミングというのを覚え始めた時の感覚に近いワクワク感なんですけど。

0 コメント
ラベル:

WebGLを動かしてみよう [ javascript / WebGL ]

間口狭っ！

セキュリティ関連の問題が残るらしいけど、ひとまずWebGLがどんなものか見てみたかったのだが…手元のパソコンでWebGL demoでググったページからそれっぽいものを開いてみようとすると、

WebGLをサポートしてないですよ

とか、

ブラウザをアップグレードしたほうがいいんじゃない？

なんて趣旨のメッセージをいただくばかり。

ブラウザは最新のChromeだってば。13.0.782.200ですよ！…ダメですか。凹むなあ。Orz

続きを読む »
1 コメント
ラベル: ,

jQuery.getJSON - クロスドメインでもOK！ [ jQuery ]

普通にsame originなサーバーからJSON形式のデータを受け取るのにも使える。

しかし真価はクロスドメインなサイトからのデータをJSONPで受け取ることにある。(と思う)

書式

$.getJSON( url, [data], [success(data, textStatus, jqXHR)] )

内部的には以下の呼び出しと等価。(なので$.ajax()でも書ける)

$.get( url, data, callback, "json" )

クロスドメインなところからJSONPでデータを取得した場合、url文字列に以下のような文字列を追加してjQueryにコールバックのフォーマットを教える。(「callback」の部分を適宜コールバックパラメータに置き換える)

http://ホゲホゲ/data/jsonp?callback=?
続きを読む »
0 コメント
ラベル:

ボールド、斜体字、文字の大きさ、アンダーライン [ CSS / html ]

よく使う文字装飾を整理しておく。

効果HTMLスタイルシート
大きさ変更<font size=n>テキスト</font>

nは1～７の整数で、+-記号をつけて相対的に指定する(+2とか-1とか)ことも可能。

font-size: サイズ指定

%かem以外を使うことがある気がしないが、その気になれば抽象化された名前(xx-small, x-small, small, medium, large, x-large, xx-large, smaller, larger)とサイズ指定(mm,em,pt等)等を指定できる。

太字<b>テキスト</b>font-weight: bold

ほかにもbolderとか数値指定とかできるようだが、bold以外を使う気がしない。

斜体字<i>テキスト</i>font-style: italic

oblique(斜体)というのも指定できる。下の２つの違いが分かる環境なら使い分ける意味があるかも知れない。

This is italic.
This is oblique.

アンダーライン<u>テキスト</u>text-decoration: underline

overline(上線)、line-through(打ち消し線)、blink(点滅)というのもあるみたい。

fontはHTML5ではサポートされなくなったらしいので、使わないほうが良さげ。

b, i, uは逆にHTML5で非推奨から再度昇格したみたい。

0 コメント
ラベル: ,

javascript - localStorageの使い方 [ javascript ]

クッキーと同じくらいメンドクサイんじゃないかと、そしてメンドクサイならもうクッキーでいいじゃないか、と敬遠していたローカルストレージ。

調べてみると使い方はとても簡単。

複雑な初期化手順は要らない、ファイル的な何かを考慮する必要もない、単純にメモリ上においたハッシュ(javascriptのオブジェクト)がページをまたがって消えないようになったもの。

こんな簡単でいいのかな？いやこんな簡単で何が悪いんだ？

そんなローカルストレージ(localStorage)について使い方の備忘録。

とりあずこれだけ押さえましょ

データを格納するlocalStorage.setItem(キー, データ)
キーに対応するデータを格納する。
データを取得するlocalStorage.getItem(キー)
キーに対応するデータを取得する。
データを削除するlocalStorage.removeItem(キー)
キーに対応するデータを削除する。
スッキリさせるlocalStorage.clear()
ローカルストレージをクリアする。全てをスッキリしてくれるが、ドメインに紐づいたデータが消えてしまうのが玉にキズ？

これだけあればまずは十分。キーとデータには共に文字列を使用すること推奨。

続きを読む »
0 コメント
ラベル:

CSS heightプロパティの%指定が上手くいかない理由 [ CSS ]

結論: いっそのこと使わないほうが楽なんじゃない？(これが結論？)

height: n%;の正しい仕様

CSSでは例えばheight: 100%;と書いた場合、実際にどういった高さとなるかご存じでしょうか? この算出値は親要素に左右されるのですが、 よく勘違いされている方がいるので…

ええ、勘違いしてました。

簡単に親ブロックに対する比率で設定できると思ったけど、親の設定が「auto」の場合はそういうわけにはいかなくて、厳密に親ブロックの高さが決まるようにレイアウトする必要があるみたい。

計算できるんだから計算結果に対する比率になるものだろうと思い込んでましたが、考えてみれば、親要素の高さは子要素の高さによって変化するものだから、循環していて計算で出るわけないですね。

一見うまく動いているように見える場合も、緩い規約の下でブラウザが拡大解釈してくれているから比較的それっぽく見えているだけ、ということだったらしい。

0 コメント
ラベル:

ブログ投稿用HTML確認ツール [ jQuery / TOOL ]

ブログの作成に高機能なHTMLエディタを使うつもりはないのだけど、その時入力しているタグを間違えてないかどうかはリアルタイムにチェックしたい。

けど、bloggerの投稿画面でのプレビューがリアルタイムじゃないのでちょっと自分でツール作ってみた。

続きを読む »
0 コメント
ラベル: ,

border-radiusの斬新な解釈 [ CSS ]

以下のような感じで画像にborder-radiusを指定すると、Chrome13とFireFox6では想定通り角が丸くなった。
のだけど…Opera11はそうなってくれない。

-moz-border-radius: 30px;
-webkit-border-radius: 30px;
border-radius: 30px;
このブラウザChromeOpera
続きを読む »
0 コメント
ラベル:

丸角、影、グラデーション [ CSS / jQuery ]

下のリンクに、角が丸くなって、影がついて、中にグラデーションがかかっていれば成功。

意図しているのはこんなボタン表示

スタイルシートとHTMLを分けて書くのはメンドクサイけど、スクリプトで書くのは苦にならない、という個人的な事情により全てjavascriptから設定しています。ホントはスタイルシートに記述しておくのが行儀のいい記法らしいけど、メンドクサイのよ。。


0 コメント
ラベル: ,

float - CSSプロパティをjavascriptで操作するときの罠 [ CSS / javascript / jQuery ]

結論: CSSのfloatプロパティはブラウザによってアクセスする名前が違うので気をつけましょう

floatプロパティは、指定された要素を左または右に寄せて配置する際に使用します。 後に続く内容は、その反対側に回り込みます。

ここがfloat:leftになっているdivのブロック
こっちはfloat:rightになっているdivのブロック

こんなふうにして使う。

回りこまれたテキストはこんな感じになる。回りこまれたテキストはこんな感じになる。回りこまれたテキストはこんな感じになる。回りこまれたテキストはこんな感じになる。回りこまれたテキストはこんな感じになる。回りこまれたテキストはこんな感じになる。回りこまれたテキストはこんな感じになる。回りこまれたテキストはこんな感じになる。回りこまれたテキストはこんな感じになる。回りこまれたテキストはこんな感じになる。回りこまれたテキストはこんな感じになる。回りこまれたテキストはこんな感じになる。回りこまれたテキストはこんな感じになる。回りこまれたテキストはこんな感じになる。回りこまれたテキストはこんな感じになる。回りこまれたテキストはこんな感じになる。回りこまれたテキストはこんな感じになる。回りこまれたテキストはこんな感じになる。

…いやCSSのfloatの説明はこのとおりなんだけど、このfloatプロパティをjavascriptで設定しようとすると罠がある。大概のCSSプロパティはjavascriptで、

続きを読む »
0 コメント
ラベル: , ,

どうやってjavascriptで表示を変更するのか？ [ javascript ]

求めていた答え:

DOM要素やそのCSS属性を適宜変更する

ただこれだけの事だった。

例えば何かの要素の表示・非表示を切り替えたければ、その要素のCSSプロパティdisplayの設定値を変更すればいい、というふうに。

続きを読む »
0 コメント
ラベル:

AJAXって何の略？ [ javascript ]

答: Asynchronous JavaScript + XML

何の略だったかいつも分からなくなるAJAX。

続きを読む »
0 コメント
ラベル:

HTMLで書く(特殊な？)記号 [ html ]

HTML中にコードとして書ける記号。
日本語フォント固有の記号かどうかを気にしながら使うくらいならコードとして書いておいたほうが気が楽だったりする。

& ⇒ &amp; < ⇒ &lt; > ⇒ &gt;、空白⇒&ampnbsp;くらいしか憶えられないのでメモとして。

続きを読む »
0 コメント
ラベル:

VIMでソースをHTML化 [ html / vim ]

必要なもの:

  • vim (version 6以降？できるだけ新しいやつ)
  • HTML化したいソースコード

作り方:

  • ソースコード全体をHTML化するなら「:TOhtml」を実行。これで終わり。
  • 一部分だけHTML化したかったら「:<範囲指定(1,20)とか>TOhtml」。vコマンドとかで範囲指定してから「:TOhtml」でもOK。
  • できたHTMLを切り取るなりセーブするなりしてうまく使おう。

0 コメント
ラベル: ,

Javascriptで配列をシャッフル [ javascript ]

配列の中身をランダムな順番に並べ替える方法。カードゲームとかランダムスライドショーとか作るときに便利？

続きを読む »
0 コメント
ラベル:
登録: 投稿 (Atom)