はじめに
ポートフォリオ作成時、画像の上にカーソルを置いた時に文字を浮かび上がらせる処理をしていました。
その処理をスマホでも適用させるための実装のメモを残します。
##結論
HTMLに以下を追加するのみです!
<div class='top' ontouchstart="">
ontouchstart="" という属性を追加することでスマホ(タッチデバイス)でも画像をタップした際にhover時の動きをしてくれます。
ontouchstartとは、その名の通り「指先が触れた時に発生する」イベントです。
この属性を追加しないと、スマホ時にhoverが反応しない事を本番環境にアップしてから気づいたので、スマホ時でのテストも大事ですね。(当たり前)
CSSに関しては何も追加しなくても適用されます。
##終わる
以上、ただのメモでした。