タブレットやスマートフォンで今まで働いていたブートストラップ ドロップダウン メニューに突然、奇妙な問題が発生しました。折りたたまれた (小さな画面の) サブメニューはクリックできません。クラスのドロップダウンメニューを持つ ul は「ブロック」のようなもので、その中の li 要素をブロックしてクリックできないようにします。小さなデバイスで li 要素を「ロングクリック」しても、それらを選択できません。それらを「高速クリック」すると、 ul 要素でカバーされている領域がミリ秒間灰色で点滅し、カバーされている領域を示しているようです。
何が原因なのかわかりません。メニューが折りたたまれるまでブラウザウィンドウのサイズを変更しても、メニューはラップトップで問題なく機能します.li要素にカーソルを合わせると、「ホバー効果」が得られます.
メニューの最初の li 要素までの私のページのスケルトンは、ここで誤って何かを壊してしまったのでしょうか? 私が理解している限りでは、javascript は問題ないはずです。そうしないと、メニューがまったく開かないでしょうか？
<!-- MENU -->
<div class="row">
<div class="navbar span10 offset1">
<div class="navbar-inner">
<div class="container">
<a class="btn btn-navbar" data-target=".nav-collapse" data-toggle="collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</a>
<div class="nav-collapse collapse">
<ul class="nav">
<%= nav_link("Home", home_path) %>
<li class="dropdown <%= "active" if params[:controller] == "courses" || params[:controller] == "enrolments" %>">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Courses <b class="caret"></b></a>
<ul class="dropdown-menu"> <-- blocking element?
<li><%= link_to "Overview", courses_path %></li>
ここでもグーグルでも修正が見つからなかったので、誰かがこの問題とその修正方法を知っていることを願っています. どうもありがとうございました！
更新: サブメニュー項目を含むメニュー項目をクリックすると、メニュー全体がクリックできなくなることに気付きました。これは、以前はクリック可能だったメニュー項目でさえ、もうクリックできないことを意味します。
突然何かがエリア全体を覆っているのではないでしょうか？
更新 2 ご回答いただきありがとうございますが、問題を新しい方向に向けていることに気付きました。Twitter のブートストラップ フレームワークを使用しているので、特にドロップダウン メニューと画像スライダーを使用しています。画像スライダーが動かなくなっていることに気付きました。これは最初の問題に関連している可能性がありますか? git コミット ログを確認したところ、bootstrap-alert.js (v2.3.1 -> v2.3.2) と jQuery JavaScript ライブラリ (v.1.9.1 -> v1.10.2) のバージョンが変更されていることがわかりました。ドロップダウン機能がまだ生きているのにスライダーが生きていない理由がわかりません。これはこれと何か関係がありますか？
更新 3 public/assets フォルダー内の application.js ファイルを置き換えると (jQuery JavaScript ライブラリ v1.10.2 を jQuery JavaScript ライブラリ v1.9.1 に置き換える)、すべてが再び機能することがわかりました。しかし、問題は、アセットをプリコンパイルすると、v1.9.1 が v1.10.2 に再び置き換えられることです。
バージョン 1.10.2 はどこで定義されていますか? これは、同じ問題を抱えている多くの人々の助けになると思います。