ジョルディの日記

Javascript で遊ぼう 第2回です。

3週間もひっぱるのもどうかなと思ったので、更新です。
Firefox でも動くようにするついでに処理内容を変えました。

ソートその2

しかし、ブラウザ間の非互換性は何とかして欲しいものです。


・・・そろそろホントに時間ねぇー

Javascript で遊ぼう 第1回です。

最近 Ajax が流行っていますが、Javascript でもリッチクライアントっぽい
何かを作れることを実証してみようと思います。

ソートテスト その1( IE のみ)

色のついている列の値で、昇順、降順にソートをします。
元に戻すボタンで初期表示に戻ります。
仕組みについてはソースを見てください。

で、問題は Firefox で動かないことで。
ただ、なぜ Firefox で動かないのか理由の見当はついているので
適当に時間を見て作り直します。
おそらく、一つの HTML 内で 同じ id (CSS の) を何個も使ってるのがまずいのでしょう。
IE では同じ id を複数記述すると、配列としてその要素にアクセスできるのですが
同じ id を複数書くのは HTML の規約違反だったと思うので。

次回の更新はきっと次の土日になります。

そのうち気が向いたらやろうと思ってた HTML ですが
いいネタを思いついたので早速いきます。

まずは、窓の杜の記事を。
http://www.forest.impress.co.jp/article/2006/07/26/tabletools.html

HTML の table タグの中身を、エクセルのように自由にさわれる拡張機能ですが
これぐらいなら Javascript でできないこともないと思うので
今週末ぐらいにちょっと作ってみようかな、と。

今回はただのネタふりなので、この辺で終わります。

第４回、とりあえず最終回です。

ヘッダ固定別バージョン

とりあえず、見てください。なかなかトリッキーなことをしています。
ただ、IE だとちゃんと動いてるっぽいのですが、Firefox だとイマイチ安定しません。
(ウィンドウをリサイズすると怪しい)
その辺改善したかったのですが、それどころでもないので。

なんか途中で飽きてしまった感のある HTML シリーズですが
そのうちまたやります。

NTFSが・・・。
さて、第３回です。

やっと本題です。
説明するよりも、実際に見てもらったほうが早いのでコレを。

<div> タグ内に以下のスタイルを追加しています。

style="overflow-x:hidden;overflow-y:scroll;"

今回も詳しいことはソースをダウンロードして見てみてください。

ただし、今回の内容には欠点があリます。
テーブルが画面サイズの横幅を超えるとスクロールバーが画面外に出てしまうため
非常に使いにくくなります。

そこで、次回は別パターンのヘッダ固定です。
こっちはテーブルのサイズに依存しないため先ほど書いたような問題は発生しません。

あー、時間ねぇー