CSSグラデーションのちょっとしたテクニック #2
前回のエントリのような応用するための基本というものではなく、CSSグラデーションはこういう使い方もできるよ的なもので３つ。普通のグラデーションの作り方はcss gradients in Firefox 3.6とかで。#3はない。 以下プレビュー画像のリンク先がデモ・ページになっているのでそちらも参照のこと。もちろん対応ブラウザのFirefox 3.6とSafari 4やChrome 4以降でないと動作デモは確認できない。 Vista風のテカってるボタン ありがちだけど作れたらなかなか便利そうなので挑戦してみたら、意外に簡単だった。実はdoubleなborderが重要で、これが無いとちょっと間抜けな感じになる。コード的には難しいことはなく、上半分にrgb(138, 138, 138)からrgb(102, 102, 102)、下半分にrgb(36, 36, 36)からrgb(0, 0, 0)と
はてなブックマークエントリー情報取得APIははてなスクリーンショットAPI(でもある)
はてなブックマークのエントリー情報取得APIは任意のURLに対するブックマークを返してくれるAPIなだけでなく、事実上はてなスクリーンショットのAPIとしても機能している。正確には、はてなスクリーンショットによるスクリーンショット画像のURLも返してくれるというだけ話なのだけど。 例としてlabs.hail2u.net/hatena/screenshot/を作成してみた。ここでは、 var sites = [ 'http://hail2u.net/blog/', 'http://la.ma.la/blog/', 'http://lowreal.net/blog/', 'http://tokyoenvious.xrea.jp/b/' ]; というURLの配列から、 <p><img src="http://screenshot.hatena.ne.jp/images/120x90/0/1/6/
hail2u.net - Weblog - 圧縮フォルダを使わないようにするとエクスプローラがキビキビ動く
Windows XPの圧縮フォルダというほとんどの人が使っていないと思われる機能(私見)を解除したら、エクスプローラがキビキビ動くようになった気がする。というようなことを某所で言ったら、試した人が「すげぇかるくなった kyo++」とかインクリメントしてくれたので、エントリにしておこうとか。 圧縮フォルダ機能の解除の方法は、コマンド プロンプトで、 regsvr32 /u zipfldr.dll regsvr32 /u cabview.dll と、入力してやるだけ。多分再起動は必要ない。 これにより特にエクスプローラのツリー表示なんかが高速化する気がする。エクスプローラ以外ではファイラーっぽいので特に高速化する感じで、僕の環境ではACDSeeのツリー表示がとんでもなく高速化した。 また、デフォルトの検索機能が圧縮フォルダ内を探さなくなるため高速化し、いつまでたっても終わらないということは少な
HTML 4.01とCSS2のHTMLヘルプ
HTML 4.01 SpecificationとCascading Style Sheets, level 2のHTML Helpを作ってみた。探せば幾つか見つけられるのだけど、キーワードがないというありがちなアレだったので。 HTMLヘルプとか二年ぶりくらいに作ろうとしたので、作り方をほとんど忘れてた。最終的にはIndexからキーワードを捏造するPerlスクリプトを作ってやったのだけど、そこまでいくのに1時間くらい格闘した気がする。HTML Help WorkshopのGUIでやるのは無理。 で、公開しようかなとか。W3C Document Licenseを読んだところ、変更を加えたり派生物的なものにするわけでなければOKっぽいので。 HTML 4.01 Specification Cascading Style Sheets, level 2 上記アーカイブはWinRAR 3.51でZ
hail2u.net - Weblog - CSS2 Specificationでのプロパティの出現順序
少し前にCSSコーディング・スタイルというエントリで書いたように、各CSSルールのブロック内でプロパティを書く順序はCSS2 Specificationで出てくる順という縛りでCSSを書いている。大体のところはソラで覚えているのだけど、font-weightとfont-sizeはどっちが先だっけとかは忘れるので、備忘録がてら序列付きリストにしてみた。 margin margin-top margin-right margin-bottom margin-left padding padding-top padding-right padding-bottom padding-left border border-top border-bottom border-right border-left border-width border-top-width border-right-widt
hail2u.net - Weblog - Amazon.co.jpの新しいアソシエイト・ツール: インスタントストア
Amazon.co.jpのアソシエイト・セントラルのトップ・ページに、なにやら「試してみよう！ インスタントストア(TM) ベータ版が登場！」という煽りが。どうやら簡単にオススメ商品のページを作成できるみたい。ストアを作ってみましょうといううたい文句になってるけど、どっちかっつーとリストマニアがトップ・ページなAmazon.co.jpのコピーサイトの作成みたいな。 インスタントストア(TM) ベータ版 Amazon.co.jpの商品で、あなたのショッピングストアを作ってみませんか？ インスタントストア(TM)なら、数分程度の簡単な設定で、あなただけのストアを作成できます。インスタントストア(TM)を使って、Amazon.co.jpの豊富なセレクションから、好みの商品やカテゴリーだけを集めたストアを作ってみましょう！ というわけで作成してみた。(ものすごく偏った)マンガで！誰も寝てはならぬは
簡単な記述でアサマシ
アサマシするにははてなダイアリーのisbn/asin記法が最強。比較的環境を選ばずに、ああいったソラでも打てるフォーマットでアサマシできれば良さそうだなというわけで作ってみた。面倒かなとか思ったけど、助言が多かったので結構簡単だった。 結果として、複数のアサマシも可能だとかそんな感じのサンプルが出来上がった。アクション！ 具体的には、アサマシHTMLコードを挿入したい場所に、 <script type="text/javascript" src="http://example.com/asamashi.js#{ASINコード}"></script> こんな感じできれば良いかなというイメージで考え始めた。 script要素のsrc属性に記述されたJavaScriptファイルのURLに引数を付けて実現している。引数の取得の方法はscript.aculo.usの動的ロードの仕組みから。scrip
CSSファイルを保存すると同時にブラウザをリロード
自動リロードで開発をアジャイルにするたったひとつの方法！や萌ディタで保存と同時にSafariをリロードするデモと似たようなものをWSH with JScriptと秀丸マクロで泥臭く実現してみようとかいう話。やろうと思えばいろんな環境で実現できそうてなもんだ。 ブラウザのリロードは魔法のメソッドSendKeyでF5を送ってやれば良し。ただ、SendKeyはアクティブなウィンドウにしか効果が無いので、 CSSファイルを保存 ブラウザをアクティブに F5をSendKey エディタをアクティブに としてやる必要がある。エディタをアクティブにするのはPIDさえ知ってればJScriptでいけるけど、調べるのはちょっと面倒。しかしながらほとんどのエディタは「既に開いているファイルを開こうとすると、既にそのファイルを開いているウィンドウ(とかタブ)を最前面にする」という動作をするので、保存したCSSファイ
JScriptでGmailの未読メール数を取得
タスクトレイに鎮座しているGoogle Talkのアイコンにカーソルを合わせてGmailの未読数を確認するのが面倒になったので、テキトウにでっち上げてみようと試みる。GmailのAtomフィードにはfullcountとかいう要素があったりしたので簡単っぽい。 こういう場合はAtomフィードをパースしてうんたらかんたらとか考えるとバカになりそうなので、JScriptでサクッとXSLT。 JScriptのコードは、 var url = "http://username:password@mail.google.com/mail/feed/atom"; var xml = new ActiveXObject("Microsoft.XMLDOM"); xml.async = false; xml.load(url); var xsl = new ActiveXObject("Microsoft.X
hail2u.net - Weblog - IEでフロートさせたボックスのマージンが倍になるバグ
WindowsのIE5.5や6など(5とか5.01は知らない)にはfloatさせたボックスへ指定した左右のmarginが正常に反映されない(倍になる)というバグがあります。最近はfloatを使ってゴニョゴニョする機会も多いと思うので厄介に考えている人も多いでしょう。実はdisplay: inline;とか指定してやると回避できちゃったりとかします。ネタ元はThe IE Doubled Float-Margin Bugだったような気がしますが、別なところで見つけたような気もする。 バグの状況自体は上記CSSバグリストのURLを参照していただければわかりやすいです。と言いつつ回避手段の使用前/後を並べてみたHTMLを用意してみました。IEで見れば一目瞭然で、1つ目のコンテナ内のフロートさせたボックスの左のマージンは倍(80px)になっているのに対し、2つ目のコンテナ内のフロートさせたボックスの
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
