- 締切済み
blank パソコンとスマートフォンで使い分けたい
htmlでサイトを作っています。 新規タブにリンクを貼るときは、target="_blank/" を使用しています。 パソコンで閲覧をする際はリンク先を新規タブにリンク先が表示された方が見やすい。 スマートフォンで閲覧をする際は新規タブにリンク先が表示されると見にくい。 パソコンではリンク先は新規タブに表示、スマートフォンではリンク先は同一タブに表示されるようにしたいのですが、どうしたらよいでしょうか? パソコン用とスマホ用で別にサイトを作るという回答以外で教えてください。
- みんなの回答 (2)
- 専門家の回答
みんなの回答
- AsarKingChang
- ベストアンサー率46% (3467/7474)
そもそも、挙動が違うので、 >パソコン用とスマホ用で別にサイトを作るという回答以外で教えてください。 ↑これが必要ですよ。 ただし、一つのページ内に、別サイトを作りますが、 PC用とSP用のサイトを同時に構築させる手法がよく使われます。 <style> .pc { display: block; } .sp { display: none; } @media only screen and (max-width: 750px) { /* SPとみなすサイズを書いておいてください */ .pc { display: none; } .sp { display: block; } </style> 後は、 <a class=pc ........... target=_blank></a> <!-- PC用 --> <a class=sp ...........></a> <!-- SP用 --> と、メディアクエリ分離するだけでOKだと思いますが。 これでは、ダメでしょうか? これでNGだと、残りはJQを使った、スクリプト式になるので、 面倒が増えるかもしれません。
- togurin
- ベストアンサー率45% (81/180)
JavaScriptを利用することになりますが、UserAgent(ブラウザ情報)を取得して、挙動を変える方法が一般的だと思います。 下記に判定方法は書かれていますし同様に調べれば色々でてくると思います。 https://qiita.com/sakuraya/items/33f93e19438d0694a91d 判定ができればそのままJavaScriptでパソコンとスマートフォンでリンクの挙動を変えることが可能です。下記が参考になると思います。他にもやり方はあると思います。 https://blog.supersonico.info/?p=1748 JavaScriptをある程度知っていないと上記の方法や参考サイトの説明の意味が分からないかもしれませんが、質問内容のことがやりたければ知る必要があると思います。