2009-10-01から1ヶ月間の記事一覧
text-shadowで文字に影を落とすサンプルです。 FireFox3.5以降とsafariでのみ実装されている機能とのこと。IEでは動作しないのでご注意 パラメータは「x座標、y座標、ぼかし具合、色」または、「色、x座標、y座標、ぼかし具合」の順で指定します。 /* * 影を…
Mixinは引数を受け付けるようにでき、関数のように使うことが可能です。 // 引数を受け取るmixin =test(!color) color = !color border: 1px solid #{!color*3} .foo // 引数つきでmixinを適用する。 +test(#111) font-size: 12px .var +test(#222) font-siz…
Mixinで、あらかじめ定義したCSSプロパティの集合を、複数のルールセットに適用することができます。よく使うプロパティセットをMixinできるようにしておけば、定義が重複してしまうのを回避できます。使い方は以下の通り。 「=」で、MixinするCSSプロパティ…
SASSではifやforなどの基本的な制御構文が使えます。 条件分岐 「@if」を使います。 @if <条件> ...<処理> @else if <条件> ...<処理> @else ...<処理>以下はフラグを見てCSSプロパティを切り替える例です。 !debug = true div // フラグをみてプロパティを…
引っ越しのため10/28よりjijiのデモサイトを停止します。再起動は、新居がネットに繋がってからになります。なるべく早く復帰させたいところですが、申し込んだプロバイダさんからレスポンスがなく状況がわからん・・・。んー。ちゃんと申し込めてるよな?
「#{!}」でセレクタやプロパティ名に変数を使うことができます。 !name="foo" !color="color" div.#{!name} background-#{!color}: #333 変換結果です。 div.foo { background-color: #333; }
「+」や「*」といった演算子が使えます。 // 演算子を使う。 // 変数の参照時と同じく「=」を使う点のみ注意。 .foo width = 10px + 10px height = 10px - 5px .var width = 10px * 10 height = 10px / 5 font-size = 10px % 2 変換結果です。 .foo { width:…
!<変数名> = <値>で定義して、以下のような感じで参照します。 .foo color = !<変数名>具体例。 // 変数を使う !color = #333 .foo // 作成した変数は「=」で参照できる。 // 「:」じゃないのでご注意。 color = !color // 変数なので値を更新可能。 !color …
「-t」オプションで変換後のCSSのスタイルを指定できます。 $ sass -t <スタイル> <変換元のSASS> <変換後のCSS>「」として指定可能な値は以下の4つ。 値 説明 nested SASSでの記述に似た感じのスタイルで出力します。(デフォルト) expanded 手書きのCSSに近…
CleverCSS: Rich Python-like DSL for CSSからのリンクより、SASSなるものを発見。 「SASS」はCSSをより簡潔に読みやすく書く為のDSLで、 以下のような機能を提供します。 ネストでのプロパティ指定 変数 一度定義した設定値の共有(mixin) 定義した「.sass」…
coliss - スタイルシートの記述をより読みやすくする5つのルールより。CSSでインデントかー。その発想はなかったなー。 #nav{ width:650px; } #nav ul li{ float:left; } #nav ul li a{ display:block; } んー、ブレースとの絡みもあって↑はチョイ微妙な気は…
URI#isAbsolute() はURIが相対か絶対かを判定するAPIですが、あれ、「/foo/var」とかはfalseを返すのか・・・。 System.out.println( "http://foo/var : " + String.valueOf(new URI( "http://foo/var" ).isAbsolute())); System.out.println( "/foo/var : "…
「cygpath」を使えばOK。「a」は絶対パスを返すためのオプションです。 $ cygpath -a ./実行結果です。 /cygdrive/c/Program Files/ CygwinでのパスをWindowsのパスに変換するには、「w」オプションを付けます。 $ cygpath -aw /cygdrive/c/Program\ Files/…
ARGFは引数がなければ標準入力からデータを読み込むので、これを使うのが楽なのかな?IOオブジェクト派生?なので、readとかgetsが使えます。以下は、標準入力のデータをBase64でエンコードして出力するフィルタの例です。 #!/bin/ruby puts [ARGF.read].pack(…
Regexp#unionで複数の正規表現のいずれか一つにマッチする正規表現を作成できます。 reg = Regexp.union( /[a-c]+/, /[l-m]+/, /[x-z]+/ ) # 以下はすべてマッチする。 puts reg =~ "aaa" puts reg =~ "bbb" puts reg =~ "ccc" puts reg =~ "lll" puts reg =…
ヒアドキュメントもありますが、%を使っても複数行文字列をさくっと定義できます。 puts %( 複数行の 文字列です。 式展開もされます。→#{1+1} ) 実行結果です。 複数行の 文字列です。 式展開もされます。→2識別子を考えなくて言い分便利かも。 なお、同じ…
$ man readとか調べていていまさら気がついたのだけど、bashでもprintfが使えるのね。 $ printf "%s:%x" aaa 100000実行結果です。 aaa:186a0pwdとかcdもbashの機能なのか。へー。
「%p」指示子で、Object#inspectの結果を出力することができます。 class Kitten def initialize( name, age ) @name = name @age = age end end puts Kitten.new( "mii", 3 ).to_s puts Kitten.new( "mii", 3 ).inspect puts "%p" % Kitten.new( "mii", 3 )…
yesは、killされるまで指定された文字列を出力し続けるコマンドです。使い方は以下。 $ yes <文字列>文字列を省略すると「y」が出力されます。 使い道 途中でたくさん「y」の入力を求められるプログラムを実行するときに使うらしい。 $ yes | <yの入力を求められるコマンド>スクリプトを書</yの入力を求められるコマンド>…
「vertical-align:middle」で縦方向中央ぞろえにした要素にfloatを設定すると、整列が解除されてしまう。んー、要素を左右に配置するならfloatだよなー、何とかならんかな、ということで、divを使って何とかしてみた。戦略は以下。 右にしたい要素をdivで囲…
String#%はsprintfなのか。 puts "aaa %s ccc" % "bbb" 実行結果です。 aaa bbb cccふむ。
グラフの設定が保存されない不具合にいまさら気がついたので、修正版をリリースします。 →Github - unageanu/jiji →Gemcutter.org - jijiGitHubのgemビルド機能が廃止になったようなので、Gemcutterにアップロードしています。gemの名前も「unagenau-jiji」→…
Gemcutterはruby gemのホスティングサービスです。 gemのホスティングのみに特化したサービス rubyforgeやGitHubと違ってソースコード管理やプロジェクト管理の機能はなく、gemのホスティングのみに特化したサービスです。シンプルなぶん、使いやすい感じで…
YUI.cachedで、任意の関数に評価結果のキャッシュ機能を付与します。キャッシュ機能が追加された関数は、初回評価時の結果を常に返すようになります。 YUI().use( function(Y) { // ランダムな値を返す関数 var base = function(){ return Math.floor(Math.r…
YUI 3: Cacheを使うと、指定された数だけの要素を保持するオンメモリキャッシュを作成できます。 // キャッシュを使うサンプル YUI().use('cache', function(Y) { // キャッシュ数を4に指定してキャッシュを作成。 var cache = new Y.Cache({max:4}); // キ…
$("#foo").text("${var}"); の場合、「${var}」に含まれるXMLエンティティはエスケープしなくていいとしても「"」や「'」は「\」でエスケープしないとJavaScript的にダメなんでは、と思ったらVelocityにちゃんと機能が用意されていましたよ、と。XMLエンティ…
プロパティ「"eventhandler.referenceinsertion.class"」と「"eventhandler.escape.html.match"」を設定することで、埋め込み文字列内のXMLエンティティのエスケープ(「<>&」→「<>&」)を行なってくれます。 デフォルトは何もしないので、明示的に設定する必…
Class.getField()は親のstatic変数も探索します。例えば、以下のコードを実行すると、 Child.B,Child.C,Parent.Aには値が設定される。 Parent.Bは初期化されない。 Child.Bが先に見つかるのでそちらが返されてしまうため。 という結果になります。 public st…
YUI 3: AsyncQueue を使うと、指定した処理を順番に非同期実行するキューを作成できます。setTimeoutでリストに追加された関数を順番に実行する、といったら分かりやすいかな。 以下はYUI 3: AsyncQueue を使って押されたキーを表示するサンプルです。高速で…
YUI 3: DataSchema を使うと、任意の形式のデータを解析してJavaScriptのオブジェクトに変換することができます。以下はDataSchema.Textを使ってCSVをオブジェクトの配列に変換するサンプルです。 // CSV形式の文字列を解析するサンプル YUI().use('datasche…