IT戦記

アダルトサイト支援機能？

ネット

FC2 ブログが課金機能を付けたみたいですね

FC2総合インフォメーション 【ブログ】ブロマガ（課金機能）　リリース！

有料のブログって聞いたことないけど、他に例ってあるのかな？

ツイートする

Permalink | コメント(3) | トラックバック(4) | 11:27

Google Chrome ではてなスターコメントの出現位置がおかしい件とその原因

はてな, JavaScript

Google Chrome ではてなスターコメントの出現位置がおかしい

こんな感じ

原因は Ten.js の以下の箇所

    getMousePosition: function(pos) {
        // pos should have clientX, clientY same as mouse event
        if ((navigator.userAgent.indexOf('Safari') > -1) &&
            (navigator.userAgent.indexOf('Version/') < 0)) {
            return {
                x: pos.clientX,
                y: pos.clientY
            };
        } else {
            var scroll = Ten.Geometry.getScroll();
            return {
                x: pos.clientX + scroll.x,
                y: pos.clientY + scroll.y
            };
        }
    },

この if 文は、 Safari 2 系かどうかを見ているんだが、 'Safari' という文字列があって 'Version/' という文字列がないかどうかを判断基準にしてしまっている。

そして、 Google Chrome には Version/ という文字列が含まれていない（僕の環境では）。

なので、 Google Chrome = Safar 2 系という判定をされて、 event.client[XY] を意図しない値として扱う。

これはいけない＞＜

レンダリングエンジンを見るべき

オープンソースなブラウザでは、ブラウザのバージョンで判定してはいけない。

レンダリングエンジンのバージョンで判定すべきだ。（自戒も込めて）

なので、 Safari という文字を見てはいけない。あくまでレンダリングエンジン AppleWebKit という文字を見るべき。

なので、 Safari 2 以前かどうかを知りたければ以下のようにするのがいい。

var m;
if ((m = navigator.userAgent.match(/AppleWebKit\/(\d+(\.\d+)?)/)) && m[1] < 500) {
    alert('Safari 2 Compat');
}
else {
    alert('Modern');
}

バージョン判定は uai.js が参考になる

JavaScript によるユーザエージェント判別

JavaScript-XPath でもお世話になっています

あと

この例の場合に限っては、 page[XY] があったらそっち使うって判定を入れてもいい気がする。ただ、保守性の問題か。

ツイートする

Permalink | コメント(2) | トラックバック(1) | 11:03