ブラウザにおける空白文字に関する考察 - elm200 の日記(旧はてなダイアリー)
趣旨 ブラウザによる空白文字の取り扱いは、なかなか一筋縄ではいかないので、これを整理してみる。 情報ソース ブラウザの問題：半角スペース、全角スペース、改行コード、整形処理 よくまとまっている。おすすめ。 ブラウザ上の空白文字の表示 一般的なブラウザ(Firefox 2 や IE6 など）で次のような HTML 文書がどのように表示されるだろうか？ (\n; は改行(LF, 0x0A), \tはタブ(0x09), \s は半角スペース(0x20)をそれぞれ表すとする) A\nB\tC\sD答えは、"A B C D"。つまり A, B, C, D のそれぞれに半角スペースが1つずつ存在する。これは簡単だ。 では、半角文字にかえて、全角文字を使ってみたらどうであろうか？ あ\nい\tう\sえ答えは、"あい う え" になる。ここで、「あ」と「い」の間に半角スペースが入っていないことに注意してほ
IE6で position:fixed エミュレーション - elm200 の日記(旧はてなダイアリー)
どうやら IE7 の標準モードでは、position:fixed （スクロールの如何にかかわらず、画面の一定の位置に表示される) がようやく実装されたらしい。が、まだまだ世の中たくさんある IE6 では、それがない。 方法はないのか、といえばある。一番まとまっているのは下のエントリ。 IEで固定座標を指定する方法 IE 独自機能である expression というのを使っているのが興味深い。以下は引用。 <!--[if lt IE 7]> <style type="text/css"> #fixed { position: absolute; top: expression(eval(document.documentElement.scrollTop+50)); left: 100px; } </style> <![endif]--> eval というキーワードからわかるように、これは
Rails 2.0 をインストールしてみた - elm200 の日記(旧はてなダイアリー)
チェックポイント Rails 2.0 (2.0.2) をインストールしてみたので、メモ。 Rails 2.0 をとりあえず使ってみる コントローラーのコード JSONP と CSRF 対策の相性 情報ソース このエントリは、実際にやったことをダラダラ書いただけなので、Rails 2.0 のさわりを簡潔に知りたければつぎのエントリがお勧め。 Rails 2.0のscaffoldを使ってみた CSRF 対策がらみでは次のエントリがまとまっている。 Rails 2.0でCSRF対策 (一言くわえておくと、Rails 2.0 ではデフォルトで POST リクエストには認証トークンが必要なようである。したがって、認証トークンを不要にする場合にだけ、protect_from_forgery を使うことになるだろう) Rails 2.0 をとりあえず使ってみる RubyGems でごく普通に最新版の R
Flash マークアップをめぐる混迷 - elm200 の日記(旧はてなダイアリー)
趣旨 Flash を HTML 文書に組み込む方法について考えてみた。基本的に Flash はブラウザにしてみれば IMG 要素で表現される画像と同じ種類の要素である(インラインレベル置換要素)。しかし、そのマークアップの方法がいまひとつわかりずらいので、解説する。 歴史的経緯 Flash を HTML 文書に組み込むには、2つのタグが使用できる。EMBED と OBJECT である。何で2つもあるのか、不思議に思うかもしれない。そこらへんの事情は次のエントリに詳しい。 .js外部ファイル編 11 FlashのEMBEDとOBJECTタグ 要するに、Flash はもともと EMBED を使って組み込まれていたのだが、そのあと W3C が「EMBED って HTML 4.0 に入ってないんだよ。OBJECT を使えよな、ゴラ！」を横槍を入れてきたので、ブラウザメーカー(Microsoft や
Flash の z-index を Javascript から有効にする - elm200 の日記(旧はてなダイアリー)
趣旨 Flash は、ただのインラインレベル置換要素であるにもかかわらず、デフォルトでは CSS の z-index に関する決まりごとに従わない。z-index とは、画面の x軸・y軸の両方に直交する軸で、要素が画面の手前におかれているのかそれとも奥かを指示する CSS プロパティである。たとえば、position:absolute で z-index を指定した DIV 要素を z-index の指定のない Flash と重ねると、本来ならば、DIV は Flash の手前に表示されなければならないのに、実際には Flash のほうが手前に来てしまう。 では打つ手はないのか、というと実は wmode という Flash のプロパティがあり、これを "transparent" にしてやればよい。たとえばつぎのような感じだ。 <!-- EMBED を使うとき --> <embed src
Javascript で Base64 encode/decode - elm200 の日記(旧はてなダイアリー)
趣旨 泣く子も黙る RFC2045 Base64 encode/decode を Javascript で実装してみた。「Base64は、データを64種類の印字可能な英数字のみを用いて、それ以外の文字を扱うことの出来ない通信環境にてマルチバイト文字やバイナリデータを扱うためのエンコード方式である」(Wikipedia) 情報ソース Base64 の Javascript による実装は、ググれば数多くある。その中でも次の実装は秀逸だった。 Base64 Encode / Decode 今回自分で書いたのは、この実装のライセンス条項がちょっと厳しかったからだ。（商用利用不可） ただし、このコードのほうが私のものより洗練されているので、ライセンス条件が合致するならこっちを使ったほうがいいかも。 使い方 入力文字列の文字コードは何でもよいが、かならず UTF-8 としてエンコードされる。(内部的に
Cookie について - elm200 の日記(旧はてなダイアリー)
基本中の基本ではあるが、案外よく理解していない Cookie について、調べてみた。 基本概念 Wikipedia "HTTP Cookie" によれば、 「HTTP cookie（エイチティーティーピークッキー、単にCookieとも表記される）は、RFC 2965などで定義されたHTTPにおけるWebサーバとウェブブラウザ間で状態を管理するプロトコル、またそこで用いられるWebブラウザに保存された情報のことを指す。ユーザ識別やセッション管理を実現する目的などに利用される。」 とある。基本的な動作については、同じく Wikipedia "HTTP Cookie" から。 そこで、1994年にNetscape Communications CorporationによってCookieが提案・実装された。Cookieでは次のようにサーバとクライアント間の状態を管理する。 1. WebサーバがWe
クリーンな JSONP リクエスト - elm200 の日記(旧はてなダイアリー)
基本概念 JSONP (JSON with Padding) とは、HTML 文書において、Javascript を使って SCRIPT 要素を動的に追加することにより、リモートサーバへのリクエスト・データの取得を可能にする技術である。 JSON という名前はついているが、取得できるデータは JSON 形式に限らない。(XMLHttpRequest の取得データが XML 形式と限らないのと、皮肉にも似ている) SCRIPT 要素を追加すると、ブラウザは Javascript ファイルをリモートサーバから読み込もうとするが、この Javascript ファイルは、読み込まれたと同時に実行されるので、ここで読み込み元のインターフェイスとなる関数を呼び出し、サーバから取得したデータを受け渡すのである。 もっとも単純化された例を示す。 <!-- ブラウザ側(jsonp_client.html)
別のサイトの iframe の中身は Javascript からは見られない - elm200 の日記(旧はてなダイアリー)
iframe に関するセキュリティ上の制限 常識かもしれないが、とりあえずメモ。 次のような HTML を考えてみる。 <html> <body> <iframe src="http://www.softculture.com/" id="iframe1"></iframe> </body> </html> これをファイルとして保存して、それを FireFox 2.0 で直接読み込む。（つまりローカルで実行) Firebugs のコンソールで次の Javascript のコードを実行すると、 document.getElementById("iframe1").contentWindow.document.body "Permission denied to get property HTMLDocument.body" と言われてエラーになる。 別のサイトを読み込む iframe の中身
HTML要素の位置設定 - elm200 の日記(旧はてなダイアリー)
趣旨 昨日のエントリで HTML 要素の位置取得について述べた。取得とくれば今度は設定であろう。位置設定にも、いくつかの落とし穴があるので、解説したい。 情報ソース 位置取得同様 W3C CSS 2.1 の次の各章が重要である。 8 Box model 9 Visual formatting model 10 Visual formatting model details これはまだ草稿(draft)レベルなので、仕様としては参照しにくいが、CSS 3 のボックスモデルの解説は CSS 2.1 を整理してかなり読みやすい文章になっているのでおすすめ。 CSS 3 CSS basic box model ウェブページ上のピクセル数を正確に測るには以下のブックマークレットが便利だ。 簡単にWebページのピクセルを測れるブックマークレット 注意 以下では、position:absolute な
HTML要素の位置取得 - elm200 の日記(旧はてなダイアリー)
趣旨 ウェブページとして描画された HTML 要素の画面上の位置を取得する。一見簡単そうに見えるこの作業が、現在実装されているブラウザ上ではとてつもなく難しい。そのことを以下で説明していく。 情報ソース この問題に関して調べたところ、最もよく出来ているエントリは、susie-t 氏による offsetTop/offsetLeft/offsetParentの闇 である。とてつもない力作で、実に多くのケースにわたって、包括的に探究が行われている。まるで犯人を追跡する刑事のような執拗さである。氏の自己紹介では「ナマケモノのプログラマ」とか謙遜されているが、これはとてもナマケモノにできる仕事ではない。 基本中の基本として W3C CSS 2.1 の次の章を抑えておきたい。 8 Box model 9 Visual formatting model 10 Visual formatting mode
CSS における display, position, float プロパティの相互関係 - elm200 の日記(旧はてなダイアリー)
趣旨 要素を描画する位置や大きさに関係する重要な 3 つのプロパティがある。display, position, float である。この3者は複雑に絡みあっていて、いつも頭が爆発しそうになる。今日は、これを整理することから始めたい。 注意事項 まず注意。 私は W3C CSS 2.1 を勉強中の身で、すべての項目にわたってきちんと理解しているとはとてもいえない。したがって、誤りも多く含まれると思うので、その点を留意してほしい。逆に間違っている場所を教えていただけると助かります。ただ、CSS 2.1 はあまりに複雑で、そのままでは頭に入らないので、「なぜこのルールは存在するのか？」ということを常に考えながら勉強していこうと思っている。これからの文章で「このルールってこういう趣旨だよな〜」とかブツブツ言っているかもしれないが、読みたい人は読めばよし、読みたくなければスルーしてほしい。 用語定
日本の未来 - elm200 の日記(旧はてなダイアリー)
最近は、Ruby ネタが少なくてすみません。 それにこのブログは結構、私の知っている人もひそかに（笑）読んでいるらしいのでうかつなことは書けないな、とかいうプレッシャーもあるんだけど・・・。まあいいや雑談モードで書いてしまえ。 最近は、どうも日本の未来に希望が持てなくて困っている。特に首相が福田さんにかわってから・・・。本当にこの社会に未来はあるのかな、とか思ってしまう。私がこういうこと書いても誰からも何の反応もないことが多かったので、いままであまり書かなかったけど、まあいいや、これからは便所の落書き感覚で書きまくってやれ。ブログなんてしょせん、その程度のものだよね。 たとえば、e-tax。税務署が必死に宣伝している、電子納税の仕組みだけど、使おうとすると本当にひどい。私は、昨日、利用者番号の取得をしたんだけど、それだけで、財務省のルート認証局のインストールをしろとか言われる。しかも IE
■ - elm200 の日記(旧はてなダイアリー)
[RMagick]RMagick のフォント指定 RMagick の RVG（ベクターグラフィックス)を使って描画を試していたが、フォントファイルを絶対パスで指定するところでつまづいてしまった。 やりたいことは以下のようなことだ。 require 'rvg/rvg' include Magick RVG::dpi = 200 rvg = RVG.new(2.00.in, 3.00.in).viewbox(0, 0, 200, 300) do |canvas| canvas.text(10, 20, "Hello World").styles(:font=>"/myfont_dir/font1.ttf", :font_size => 12) end 上のコードを実行すると、 Magick::ImageMagickError: Non-conforming drawing primitive
sqlite3 でデータエクスポート＆インポート - elm200 の日記(旧はてなダイアリー)
sqlite3 で データのエクスポート＆インポートしようとしたが、意外と情報が少なくて難渋した。そこでここにメモする。 情報ソース SQLiteのドットコマンド .help や .schema 等 "." ではじまるコマンドのリファレンス。 エクスポート たとえばタブ区切りでテーブル foobar の内容をファイルに保存したい場合は次のようにする。 % sqlite3 mydb.sqlite3 SQLite version 3.3.8 Enter ".help" for instructions sqlite> .mode tabs foobar # 出力をタブ区切り表示に変更 sqlite> .output foobar.txt # 出力先を "foobar.txt" ファイルに変更 sqlite> select * from foobar; # データ出力のように行う。 インポート
らくらく BASIC 認証 on Rails - elm200 の日記(旧はてなダイアリー)
趣旨 Rails アプリでプロトタイプを作ったときに、BASIC 認証を掛けて限定公開したいと思うときがあるかもしれない。ところが Rails ではそれが案外難しい。Apache をかませないと BASIC 認証ができないからだ。そこで WEBrick を使って BASIC 認証を行うようにしてみた。 情報ソース 基本的には、私が過去に書いた SSL 上で WEBrick を動かす WEBrick で Basic 認証を行う という２つのエントリの応用編である。 使い方 下のソースコードで OPTIONS = { :realm => 'My Application', :user => 'guest', :password => 'passwd', ... とある部分を適宜変更して、webrick_basic_auth.rb という名前のファイルで保存し $RAILS_ROOT/scrip
CentOS 4.5 に Apache 2.2.6/Subversion 1.4.5/Trac 0.10.4 をインストール - elm200 の日記(旧はてなダイアリー)
趣旨 CentOS 4.5 に Apache 2.2.6/Subversion 1.4.5/Trac 0.10.4 を入れようとしてハマリまくったのでメモ。結論からいうと CentOS 4.x では yum で新しいパッケージが入れられないので、ソースコードからコンパイルするしかないようだ。さもサクッと入れられたかのように書く。 情報ソース メモ/WebDAVでSubversion Apache 2.2 + Subversion 1.4 のインストール Subversion と Trac のインストール方法とハマりポイントのまとめ Subversion 1.4 と Trac のインストール。 インストール方法 apache 2.2 Apache 2.2.6 を本家からダウンロード＆インストール。 tar zxvf tar httpd-2.2.6.tar.gz cd httpd-2.2.6
dRuby を使って Excel ファイルの中身を配信 - elm200 の日記(旧はてなダイアリー)
趣旨 私は Windows (ホストOS) + VWMare 上の Linux(ゲストOS) という構成で開発を行っているのだが、どうしても Linux 側から Excel ファイルを読みたくなった。そこで、dRuby を使って Windows 側から Excel ファイルの中身を読み出す Ruby プログラムを書いてみた。拙いコードだが皆さんの参考になれば幸いである。 使い方 サーバ側 下のソースコードを excel_server.rb というファイル名で Windows マシン上に保存する。いま仮に C:\ に保存したとする。次のようにして実行。 C:\>ruby excel_server.rb druby://windows_pc_name:12345 Press any key to quit.となるはずだ。これでサーバ側の準備 OK。 クライアント側 % irb --simple
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
trac の設定 - elm200 の日記(旧はてなダイアリー)
漢字だけを抜き出す Ruby の正規表現 - Rails で行こう！ - Ruby on Rails を学ぶ
