シンクグラフィカ札幌

TabOpener.js

TabOpener.js

スマートフォンやタブレットなどで画像を新規タブで表示し、タブを閉じるボタンを自動的に配置するスクリプトです。LightboxやThickbox、Fancyboxなどは便利ですが、スマホやタブレットだと意外と邪魔臭いんですよね。

スマートフォンやタブレットなどのタッチデバイスの場合、画像を見るときはピンチズームが使える方が良いですよね。でもレスポンシブWebデザインにしてno-scaleにするとピンチズームは使えないし、かといってLightboxやThickbox、Fancyboxで拡大表示にしても小さいまま・・・。

そんなときはいっその事「別タブ」で開いたほうがユーザビリティ的に優れていると言えます。しかし_blankで別タブ表示にすると戻るのがちょっと大変。閉じるボタンを配置したくなりますよね。

そんなあなたの長年の悩みを解決するのがこの「TabOpener.js」です。classに「TabOpener」を指定するだけで別タブ表示と閉じるボタンの配置を自動的にやってくれます。

TabOpener.jsの機能

TabOpener.jsには以下の機能が盛り込まれております。

新規タブで画像を表示
画像またはアンカーをタップした場合に、新規タブで画像を開きます。class名を指定するだけでOK。スマートフォンやタブレットなどで、別タブで画像を開けるってピンチズームも使えて便利ですよね。

TabOpener.jsのデモ

TabOpener.jsのサンプル
まぁ見てみてください。思う存分見るといい。そして楽しむといい。少し休んでから、また見るといい。

TabOpener.jsの更新履歴

2014-09-02iOSのWebView(アプリ内ブラウザ)時の挙動を改善したバージョンを公開
2014-09-01公開バージョン

TabOpener.jsのダウンロード

TabOpener.jsのダウンロード

TabOpener.jsの過去のバージョン

Release Version Download
2014-09-02 1.0.1 Download
2014-09-01 1.0.0 Download

TabOpener.jsのユーザレビュー

必須お名前
必須メールアドレス
必須確認のためもう一度
必須評価
必須レビュー内容
必須掲載確認