web制作初心者です。趣味でレストランのwebサイトを作成してリンクのエラーの原因が全くわかららず助けてください。。
http://www.res-yamaguchi.jp/
上記サイトですが、スマホの幅(670px以下)になると80px下にスクロールすればSNSのアイコンや電話のアイコンが表示されるようにしているのですが電話のアイコンからをタップしてもリンクが起動しません。
他のアイコンはクリックしても問題なく他ページに飛べるのですが、原因がなんだかさっぱり分からず困っています。
お知恵拝借できますと幸いです。
何卒よろしくお願いいたします。
みんなの回答 8 件
俺のスマホで試したら電話かかりそうになったぞハゲ
同郷のよしみで色々言わせてもらうけど、画像の最適化くらいしなさい。背景画1.1MBもあるってのはアウト。フォトショの書き出しダイアログでできますよ。このサイズだったらJPGで圧縮率を手動で調整した方が良いだろうし、pngでもtinypngかけたら57％削減で半分以下にできる。モバイル対応前提なら尚更。そのままimgタグ使いたいならsrcsetか、cssのbackgroundで対応する方法あり。
<a href="tel:***">リンクをスマートフォン端末以外では無効にする - Qiita
http://qiita.com/shouchida/items/a057a869003e4e2eb009質問とは関係ないけど文字やボタンが小さくて見辛いアンド押しづらいのでそこら辺のUIは改善する必要あるとおもいます
chromeのエミュレーターで押したらbefore 疑似要素消えたよ
中途半端でごめんやけど
なんでお前の道楽でやってる小遣い稼ぎに協力せねばならんのだよ。いい加減にしろ。
#pageTop-3 a:hover {
opacity: 0.8;
display: none;
}
こいつのせい
ガチで答えます。#pageTopとか#pageTop-1とかある集まりにそれぞれちゃんとz-indexを指定してあげましょう。全部9999にしておきましょうね。ただの重なりの問題だとおもいます。
おかげさまで問題箇所解決しました。また問題箇所以外にも色々とご指摘くださり勉強になりました。次回のUPDATEの際に色々と手を加えてみたいと思います。ありがとうございました。
関連するトピックス