ホバーエフェクトのレスポンシブ

Question

###マウスホバーエフェクトのレスポンシブについて
パソコンサイトで、画像の上にマウスが来たら文字が表示され、クリックしたらURLに飛ぶように作りました。
スマホで確認すると、画像をクリックしたらすぐにURLのサイトに飛んでしまい、文字は表示されない普通の画像のようになってしまっています。飛んだ後に元のサイトに戻って確認すると文字が表示されています。

マウスホバーエフェクトはスマホでは難しいのでしょうか？
パソコンのみの機能？なのでしょうか・・・
ご教示お願いします。
###参考サイト
サンプル05です。
(http://blog.raizzenet.com/mouse-hover-effect-of-card-type-design/#)

Answer 1

スマホで確認すると、画像をクリックしたらすぐにURLのサイトに飛んでしまい

画像をクリックとはタップの事でしょうか？
一般的なスマホにはマウスがないため、マウスオーバーエフェクトは実装できないと思います。
画像タップ時にスマホかどうかの判断をして処理を切り分けてみてはどうでしょうか。

Comments

[ituski]

ご回答ありがとうございます。
すみません、そうです。タップのことです。
どこかのサイトで1回タップしたら文字が表示され、もう1回タップしたらリンクへ飛ぶという風にされているところがありました。そのように別の方法を取った方が良いということですね…
検討してみようと思います。