[解決]ブラウザで、skypeが勝手に電話番号を改変する件

skypeのプラグインをインストールしていると、webページ内に電話番号があったときに、良い感じで表記を変えてくれます。

で、どうにかならないかなーと検索していると、やはり、と言いますか、あちこちで『どうにもならない』といった声しか見当たらなかったようなので、どうにかしてみました。

web制作する人でも、skypeを入れていない人は気がつきようがないと思いますので、実は、ユーザーさんとこではおかしく表示されているって事態があるかもしれません。

どういう意味かよく分からない方は、まず、下記のリンクをご覧になってみてください。

ブラウザでskypeが電話番号を変える問題

skypeのプラグインが入っていると、こんな感じで電話番号の部分が勝手に変えられてしまいます。

Gogle検索 => ブラウザ skype 電話番号 表示

インストール後の電話番号表示の変更について

skypeのアドオンで、電話番号表示が変!

Skypeでブラウザの数字列が電話番号として表示されてしまう

困っているという声はたくさん見つかるものの、肝心の解決できる方法が見当たりません。
プラグインを外せばOKという回答はありますが、それ、ユーザーさん1人1人に呼びかけますか?現実的ではないので、これは回答にならないですね。
web制作者側で意図して外せる方法が、本当の解決方法だと思います。

skypeが電話番号を変えると何が問題なのか?

普通のwebサイトだったら良いと思うんですよ。
誰もが自由に閲覧できる公開されたwebサイトだったら良いと思うんですよ。

でも、ですね。
一般的に、管理画面って呼ばれる類のwebページの中でまでやられると困ります。いえ、私は困りません。使う人が困ります。ユーザーさんが困ります。

あと、最近では、webブラウザを使って閉じた社内ネットワークで使うwebアプリケーションってのも主流になってきてます。当然ながら複雑な画面になってしまってるかもです。1つの画面の中に項目数多数です。電話番号ってだいたい10文字くらいって決まってるじゃないですか。文字数が決まるってことは、必要とする幅も決まってくるので、ガチガチに寸法とったりする場面もあるんじゃないでしょうか?

あくまでも、管理画面での話しですが。
一般ユーザーの管理画面じゃなくって、システム管理者的な管理画面だと、そんな感じになってこないでしょうか?

あとは、webサイトを発注する企業さんとか・・・。
担当者さんの好み次第ですよ。担当者さんに、「この変なの外して」って言われたらどうしましょうか?
web制作会社さん、涙目?
これは、無理です、skypeのせいです。プラグイン外しましょうって言いましょうか。

担当者さんが言わなくっても、だってさ、キレイにデザイン考えてHTMLにして完成しました。これでどうだ!って感じで納品したら、お客さんところにスカイプが入っていて、電話番号のところだけ浮きまくりの統一感のない電話ボタン。
webデザイナーさん、涙目?
だからって、skypeのイタズラありきでなんて、デザイン考えられませんよね。

ブラウザでskypeに電話番号を変えられて困るので・・・

javascript版と、jQuery版の2つを用意しました。
実は、微妙に動作が違います。

javascript版では、1度skypeに邪魔をされたら、やり返します。
それで終了します。
調査していると、skypeは、1回だけ邪魔をしたら、おとなしくなるようなので、無駄なループはせずに終わるようにしています。

一方、jQuery版のほうは、1000ミリ秒 = 1秒ごとに、skypeに邪魔をされていないかチェックします。

お好みでお使い頂ければ良いのですが、オススメはjavascript版です。

javascript版

<script type="text/javascript">
(function(){
  var d = document,
    h = d.getElementsByTagName('head')[0],
    id = setInterval(function(){
    var s = h.getElementsByTagName('style'), u = 'undefined', c = 0;
    for(var i = c = s.length - 1; i >= 0; i--){
      if (typeof s[i] != u && s[i].className == 'skype_out'){
        if (i == c) return;
        s[i].parentNode.removeChild(s[i]);
      } else if (s[i].innerHTML.indexOf('span.skype_pnh_print_container') > -1){
        clearInterval(id);
      }
    }
    var n = d.createElement('style');
    n.className = 'skype_out';
    n.appendChild(document.createTextNode(
      'span.skype_pnh_print_container{display:inline !important;}'
      + 'span.skype_pnh_container{display:none !important;}'));
    h.appendChild(n);
  }, 1000);  //  1000 = 1秒間隔
})();
</script>

jQuery版

<script type="text/javascript">
(function(){
  var id = setInterval(function(){
    if ( ! jQuery('head style:last').hasClass('skype_out')){
      jQuery('head style.skype_out').remove();
      jQuery('head')
      .append(
        jQuery(document.createElement('style'))
        .addClass('skype_out')
        .html(
          'span.skype_pnh_print_container{display:inline !important;}'
          +'span.skype_pnh_container{display:none !important;}'
        )
      );
    }
  }, 1000);  //  1000 = 1秒間隔
})();
</script>

jQuery版カスタマイズ

1箇所だけ、カスタマイズして頂くところがあります。

}, 1000);  //  1000 = 1秒間隔

この部分ですが、1000 を 500 にすると、0.5秒間隔になります。
2000 にすると、2秒間隔になります。

反応が遅いな、とか、もっと遅くても良いなーなんて場合に、お好みで数字を変えてお試しください。

広告

4 件のコメント

  • そぅなんですよ!
    サイト側での解決策が欲しかったんですよ。
    ありがとうございます。
    早速、チャレンジしてみます。

  • 非常に参考になりました。
    有難うございます。

    またブログの方、ちょくちょく拝見させて頂きます。

  • とても参考になりました!
    ただ、実際に使ってみたところ一部のクロームブラウザで電話番号自体が消えてしまう現象がおこりました。
    何か解決法があれば教えて頂ければと思います。