MD-Blog_Web Creative

前回、jQueryプラグインを作ってみて楽しかったので、今回もjQueryプラグインを作ってみました。

Webサイト制作時、非対応のスマホにアラートを出すことありますよね？

ただ、作業の優先順位的に後回しになってしまいがちで、最後に焦って実装することが多いんです。

そこで、もっと簡単に実装出来たらな良いなと思い「jQuery.notSupported.js」というプラグインを作ってみました。

基本的な使い方は、

$.notSupported();

これだけです！
簡単ですよね？

オプション

もう少しカスタマイズしたい方に向けて、オプションを用意しました。

android

指定したAndroidバージョン未満の場合アラートを出します。

• 型: number
• 初期値: 4

ios

指定したiOSバージョン未満の場合アラートを出します。

• 型: number
• 初期値: 8

text

指定した文字列を出力します。

• 型: string
• 初期値: '大変申し訳ございませんが、お客様の端末は本サービスの非対応端末になります。'

class

指定したclass名を付与します。

• 型: string
• 初期値: 'notsupported'

使い方

下記のように使用します。

$.notSupported({
    android: 5,
    ios: 9,
    text: '非対応端末です',
    class: 'hoge'
});

こういう所はサクッと終わらせて、他の所に工数をかけたいですね。
今後もサイト制作に役立つプラグインを作っていきたいと思いますので、是非使ってみてください！

DEMO

• https://www.monster-dive.com/blog/_sample/161125/jquery.notsupported.html
  Android6未満、iOS10未満の端末でご覧ください。

ダウンロード

• jquery.notsupported.js
• jquery.notsupported.min.js（圧縮版）

動作確認済みjQueryバージョン

• jQuery 1.12.4
• jQuery 2.2.4
• jQuery 3.1.1

動作確認済みブラウザ

• Android: Google Chrome最新バージョン
• iOS: Safari最新バージョン、Google Chrome最新バージョン

ライセンス

• MIT

※当プラグインを使用して生じた、何らかのトラブルや損失・損害等につきましては一切の責任を負いません。