和田憲幸のブログ

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

スマホ対応のタブ切り替えJavascript

レスポンシブWebを意識したタブ切り替えJavascriptを公開しました。

2012-10-08 23:32:00
入力時間 / 06:41

サンプルダウンロードページです。サンプルが雑ですいません。なんか面倒くさくて・・・。
※サンプルはスマホに最適化していません面倒なので。

最近ちょっと誰に頼まれたわけでもないんですけどレスポンシブWeb仕様のサイトを何件か作っていまして、今まで使ってた自前のタブ切り替えでいろいろ面倒だったので書きなおしてみた。レスポンシブWeb仕様と言っても「スマホの場合に最適化する」というような凝ったものではなく「スマホの場合、無効にする」という簡素なもの。もちろんスマホの場合でも有効にすることはできる。

スマホサイトを作ったことがある人であればわかると思うが、あまり込み入ったことをすると途端に面倒くさくなるのがスマホサイトだ。そして込み入ったことをすると大抵見づらくなる。タブの数が2つ3つ程度であればスマホで展開してもいいんだけど、それ以上になるといろいろしんどいのでページ内アンカーのほうがユーザビリティに優れている場合も少なくないと思うのだ。という仕様。

あくまでも美しいHTMLの構造体があって、そこにJavascriptでちょっとした味付けをする。というのはやはり気持ちがいいもんですね。あぁ愛しているよHTML。ということでぜひ使う機会があれば使ってみてください。

P.1271