和田憲幸のブログ

札幌市南区在住、個人事業のWebエンジニア 和田憲幸(40歳)のブログです。

久々の新作スクリプト「TabOpener.js」

スマートフォンやタブレットで画像を拡大表示するときに新規タブで開いたほうがいいよね~というスクリプト。

2014-09-01 12:50:11
入力時間 / 04:29

花火の写真(Fireworks)

久々の新作スクリプトです!マサヒロに捧ぐ「TabOpener.js」。スマートフォンやタブレットの場合、lightboxやthickbox、fancyboxで表示すると却って見づらくなりますよね。あんまり拡大できないし。やっぱりピンチズームできたほうが便利じゃん!と、いうことでこのブログでも長らく画像は別ウィンドウ表示にしていたのですが、タブを閉じるのがちょっと面倒。そんな面倒くさがり屋のあなたのためのスクリプトです。

上記の画像をクリックしてみてくだされ。恐らく閉じるボタンが追加された背景黒の別タブが開いたんじゃないでしょうか。そういうことです。新作スクリプトと言うにはややショボいですが、使い勝手は悪く無いと思うんよ。

ドキュメント内のclass指定をしたimgタグかaタグのいずれかを拾ってきます。imgタグの場合はsrc、aタグの場合はhrefがソースとして別タブで開きます。独自属性のdata-srcを指定してもOK。新しく開く画面はCSS等でカスタマイズできるので、もうちょっとしっかりデザインしてもよいかもね。

実際の所、PCのブラウザを含めてすべてのブラウザがタブ表示に対応していると言っても過言ではないので、大きく見やすいという意味では別タブ最強なんじゃないかなって思っています。

TabOpener.jsダウンロード

TAG

P.1603

あらゆさん
なんかコメントのメール欄も進化している気が?
和田さんはやっぱり目の付けどころが凄いと思います。
参考にさせてもらいます。
…それにしてもこのスクリプトのパッケージがとてもセンスいいですw2014-09-03 17:12:46
和田
> あらゆさま
目の付け所が・・・・>シャープですか!
いや~むしろ目を付けたのはマサヒロくんなので、マサヒロの方向にぜひ一例を(笑)2014-09-12 06:27:04