札幌Web制作のシンクグラフィカ

TabOpener.js

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

TabOpener.jsの概要

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

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

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

TabOpener.jsの機能

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

デモサイト

https://lab.synck.com/TabOpener.js/

最新版を無料ダウンロード

TabOpener.jsの更新履歴

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