「is(‘:hover’)」がMozilla FirefoxとMicrosoft Edgeでは効かない話

JavaScriptの話

2017.03.21

​キレそうです。
Google Chromeではもちろん動く、Internet Explorerでも問題なし、ところがMozilla FirefoxとMicrosoft Edgeは言うこと聞かないじゃないですかーーー!やだーーーーー!

ということで表題の件です。
何が動かないってjQueryで条件分岐として「is(‘:hover’)」を記述したのですが、結果としてtrueしか返してくれないのです。それもFirefoxとEdgeだけ。対処法を忘備録として残しておきます。多分2つあると思います。

問題のコードは下記の通りです。

条件分岐させない

「hover()」メソッドを使ってみましょう。

代替ファンクションを作る

いやいやでもどうしても条件分岐させたい!そんなときは「is(‘:hover’)」に代わるものを作っちゃいましょう。
こちらのサイトを参考にしました。
http://stackoverflow.com/questions/8010267/jquery-condition-check-ishover-not-working

ベストアンサーの方のコード部分を転記します。

idIsHovered(‘hoge’)と記述することで、「hoge」というid名で「:hover」状態にあるものの数を数えて1だったら「true」を返す、ということらしいです!(多分)

これをちょっとだけ変えちゃいましたが、前述の問題コード直すと以下の通りです。

最後に

調べていくうちに英語サイトにたどり着いてしまい、英語力中学生以下の私はめげそうになりました。でもコードだけよーく見てみると何をいいたいのかなんとなく分かっちゃったりして、やはりコードは世界共通なのだなあ、などと感心していました(笑)
それから、いつでもゴールまでの道筋は複数あるものだな、なんて思ったり。頭を柔らかくしていたいものです!

この記事へのコメント

コメントはまだありません。

コメントを残す

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください

JavaScriptの話の最新記事

ページの先頭へ戻る