何から書こうかな
まず前回の続き
1.setIntervalで、イベントをonclickからonmouseover,onmouseoutに変更、等速から等加速運動に変更
http://sakurachiro.com/_exercise/javascript/timer/setInterval_opacity_1.html
setIntervalで呼び出す関数に引数を持たせたら動かない
これだとダメ
aID1=window.setInterval(alphaSet1(minA),reftime);
functionで呼び出したらok
aID1=window.setInterval(function(){
alphaSet1(minA);
},reftime);
引数はこれで解決したものの
setIntervalが同時に何個も呼ばれてしまい失敗。
2.上記に関数が動いてるかのチェックを追加
http://sakurachiro.com/_exercise/javascript/timer/setInterval_opacity_2.html
3.行き詰ったのでsetTimeoutを勉強してみる
http://sakurachiro.com/_exercise/javascript/timer/setTimeout_opacity_1.html
と、こんな感じまできた
次は、現在1個のidにしか対応してないので、対象の要素(とりあえずa?)が複数あれば勝手に全部対応できるようにさせる。
肝心のopacityは
CSS Validation Service|テキストエリアに直接入力して検証によると
プロパティ opacity は CSS レベル 2.1 に存在しませんが、[css3] に存在します
なんだけど、IE以外のブラウザ、opera/google chrome/safari/Firefox なんかはすでにopacityに対応してる。
IEは独自拡張のfilterをつかって対応
filter:alpha(opacity=20);
その場合hasLayoutをtrueにしておく必要があるみたい(clearfixみたいにzoom:1が影響がない?)
しかし独自拡張かぁ。
CSS3も先行実装なんだけど、いつか実装された時に修正なしで使えるのがいいおね。
[...] またもや前回の続き 次は、現在1個のidにしか対応してないので、対象の要素(とりあえずa?)が複数あれば勝手に全部対応できるようにさせる。 [...]
ピンバック by ロールオーバーでimgをフェード « 乱雑モックアップ — 2009年9月15日 @ 13:55