今回はかなり技術的なお話です。
プログラミングに興味のある方のみ、読み進めていただければと思います。
今参加しているプロジェクトで、「curvycorner.js」というJavaScriptファイルを使用しています。
これはJavaScriptのライブラリ(ある機能をひとまとめにしたもの)で、 「任意のブロック要素の角を丸く加工する機能」 を提供するものです。
これがIE10で正しく動作されず、昨日検証していました。
原因の1つ目は、ブラウザ判定ロジックの中にある、IEだった場合にバージョンを取得する処理でした。
誤:this.ieVer = this.isIE ? /msie\s(\d\.\d)/.exec(agent)[1] : 0; 正:this.ieVer = this.isIE ? /msie\s((\d+)\.\d)/.exec(agent)[1] : 0; ようは、「ユーザエージェントの"msie"の後に続くバージョンを取得するよ」ということなのですが、 正規表現で「数字1桁+.+数字1桁」という認識をしているのですが、これだと「10.0」が取得できずエラーとなっており、その後のプロパティ設定が正しく行えていませんでした。
2つ目は、透過度を設定する処理でした。
誤:var trans = filter ? parseInt(/alpha\(opacity.(\d+)\)/.exec(filter)[1]) : 100; 正:var regExpFilter = /alpha\(opacity.(\d+)\)/; var trans = regExpFilter.test(filter)[1] ? parseInt(regExpFilter.exec(filter)[1]) : 100; 三項演算子を用いて、「filterの状態を判定して、結果がtrueならparseInt~を、falseなら100を設定するよ」という式です。
これについては具体的な解決理由がよくわかっていないのですが、正規表現の透過度設定をfilterにテストした結果で判定するということのようです。
動作した時はかなり感動しました。
この調子で、プログラミングで自分がやったこともここに書いていこうと思います。