パソコンとスマートフォンでリンク先や表示を変更(備忘録)

備忘録です。

PC・スマホによってリンク先を変更(表示は同じものを使用)

<a href="https://blog-imgs-108.fc2.com/s/a/k/sakuraxren/2017111025.jpg" data-sp-href="https://blog-imgs-108.fc2.com/s/a/k/sakuraxren/2017111023.jpg?smartphone" target="_blank"><img src="https://blog-imgs-108.fc2.com/s/a/k/sakuraxren/2017111025s.jpg" alt="2017111025.jpg" height="320" width="480" border="0" /></a>

2017111025.jpg

【上記画像をクリックしたときのリンク先表示】
2017112201.jpg



PC・スマホによって表示を変更

<a href="https://blog-imgs-108.fc2.com/s/a/k/sakuraxren/2017111025s.jpg" target="_blank" img class="pc"><img src="https://blog-imgs-108.fc2.com/s/a/k/sakuraxren/2017111025s.jpg" alt="2017111025.jpg" height="160" width="240" border="0" /></a>
<a href="https://blog-imgs-108.fc2.com/s/a/k/sakuraxren/2017111023s.jpg" target="_blank" img class="sp"><img src="https://blog-imgs-108.fc2.com/s/a/k/sakuraxren/2017111025s.jpg" alt="2017111025.jpg" height="160" width="240" border="0" /></a>

2017111025.jpg

2017111025.jpg
【パソコンとスマホで見たときの表示の違い】
2017112202.jpg

2017112203.jpgちなみに……
編集画面のリアルタイムプレビューで見たらこんな感じで、両方表示されている。


関連記事

0 Comments

Post a comment