シェアボタンを押した時に小窓で開くようにする方法 | q-Az
記事下などにある SNS のシェアボタンを押した時に、別タブではなく小窓で開くようにする方法です。JavaScript を使って実装します。小窓というのは小さなウィンドウのことです。 小窓（小さなウィンドウ）で開くメリット 小窓で開くことのメリットは色々ありますが、それぞれのシェアボタンの移動先が小窓で開くことが前提になっている SNS もあるので、そのまま別タブで開くと表示が崩れる SNS もあります。facebook や Google+ がそうですね。 小窓で開かない場合 別タブで開くことになるので、余白が多く左によってしまい不格好です。 小窓で開く場合 小さなウィンドウで開くので余白がほとんどありません。 また、小窓で開くことで別タブに行ってしまうことがないので、ページに留まってもらいやすいとかいうことがあるかもしれませんし、ないかもしれません。 以下スクリプトコードの解説です。 シ
SNSのシェアボタンの設置方法まとめ (サンプルコード付き)
サンプルデモ真ん中寄せをして、ウィンドウの横幅が480px以上の場合は、5つのシェアボタンを横並びで表示し、スマホなど、ウィンドウの幅が狭いブラウザでは、LINEを含めた6つのボタンを1行に3つずつ表示するレスポンシブ仕様になっています。ここで表示している個々のボタンは画像を使用していますが、実際と同じように動作するので、ウィンドウの幅を広げたり縮めたりしてみて下さい。実際のシェアボタンでのデモを見たい人は、「サンプルデモを見る」のボタンから別ページにアクセスして下さい。 HTML <h2>シェアボタンの表示</h2> <p>横幅を狭めると、2行になり、LINEボタンが出現します。LINEボタンの画像は、<a href="https://media.line.me/howto/ja/" target="_blank">公式ウェブサイト</a>よりダウンロードする必要があります。</p> <
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
HTMLとCSSだけで簡単に作れる！ トグルボタンの作り方！！
