Qiita Teams that are logged in
You are not logged in to any team

Log in to Qiita Team
Community
OrganizationAdvent CalendarQiitadon (β)
Service
Qiita JobsQiita ZineQiita Blog
25
Help us understand the problem. What is going on with this article?
@the_fukui

未だに Internet Explorer を使ってアクセスしてくる人を笑うスクリプト

More than 1 year has passed since last update.

令和になってもInternet Explorer(以下 IE )を使っている人を笑うスクリプトを作った。

使い方

scriptタグのペースト / npm install の2パターンに対応している

scriptタグを使う方法

<script src="https://unpkg.com/laugh-at-ie/dist/index.js"></script>
<script>
var laugh = new LaughAtIE();
laugh.init();
</script> 

これをページに貼り付けるだけ

npm install する方法

npm install laugh-at-ie

して、

import LaughAtIE from 'laugh-at-ie'  

const laugh = new LaughAtIE()
laugh.init()

を貼り付ける。
当たり前だがクライアントサイドでしか動かないので注意。

カスタマイズ

new LaughAtIE() のオプション引数を設定することで、音源を変更したり、笑い声の再生時にお好みの関数を実行することができる。
下記はデフォルトの設定。

var laugh = new LaughAtIE({
    onLoad: {
        //ページ読み込み時の設定
        sound: 'https://laugh-at-ie.netlify.com/sound/laugh.mp3', //再生する音源
        callback: function(){} //再生時(ページロード時)に実行する関数
    },
    onError: {
        //ページでエラーが発生したときの設定
        sound: 'https://laugh-at-ie.netlify.com/sound/laugh2.mp3',
        callback: function(e){
            //エラー時はエラーメッセージを引数に取ることができる
            alert('Error!\n\n' + e)
        }
    }
});
laugh.init();



カスタムした設定はデフォルトの設定とマージされるので、例えばエラー時の音源だけを変えたい場合は

var laugh = new LaughAtIE({
    onError: {
        sound: './your-custom-sound.mp3',
    }
});
laugh.init();

とだけ指定すれば、デフォルトの設定を引き継ぎつつ、エラー時の音源だけを変更することができる。

サンプル

デモサイト の設定はこんな感じ。

function error(e) {
    var confirm = window.confirm('Error message: ' + e + '\n\nAn error occured. Do you want to get Chrome?');
    if (confirm) {
        location.href('https://www.google.com/chrome/')
    }
}

function welcome() {
    alert('Are you still using Internet Explorer???');
}

var laugh = new LaughAtIE({
    onLoad: {
        callback: welcome
    },
    onError: {
        callback: error //末尾に()をつけてしまわないように!
    }
});
laugh.init();

レガシーなWebアプリ、サイトを使い続けたいとい理由でIEを使い続ける人がいるのも重々承知していますが、IEはWeb開発者にとって長年悩みの種であるので、モダンブラウザへ移行してほしいですね。
当のMicrosoftも使うのやめて1って言ってますし。

あと、ライブラリっぽく公開するのは初めてなので何かあったら笑いながら指摘して下さい。

$Thank$ $you.$

25
Help us understand the problem. What is going on with this article?
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
the_fukui
フロントエンドを少々。 Nuxt.jsが得意なふりをしています。

Comments

No comments
Sign up for free and join this conversation.
Sign Up
If you already have a Qiita account Login
25
Help us understand the problem. What is going on with this article?