0

だから、私は現在これをやろうとしています:

 <table class ="tablez">
 <tr>
 <th>Table Title </th>
 </tr>
 <tr>
 <td>
 <a tabindex="0" class="clickable">Click Me!</a>
 <div id="showedClickable">
 <p>This is showed when Click Me! is clicked.</p> 
 </div><!--EO showedClickable -->
 </td>
 </tr>
 </table>

クラスはこちら

  #showedClickable {
 position:absolute;
 display:none;
 width:auto;
 height:auto;
 }

クリックするとどうなりますか。

 a.clickable:focus + #showedClickable {

 display:block;
 }

ラップトップのクロムでは問題なく動作しますが、モバイル (iPhone) でこれを試してみるとうまくいきません....ここで何が問題なのですか?? どうすればこれを回避できますか、これを解決できますか?

お時間をいただきありがとうございます！

4

1 に答える 1

0

私はこれと同様の問題を抱えていました。問題は、iPhone が CSS のイベントに基づいて兄弟を再描画しないことです。

このように要素をネストし、兄弟セレクターではなく子セレクターを使用してみてください。また、クリックするアイテムは、表示されるものの見出しであることが多いため、一般的によりセマンティックです。

奇妙なことに、iPad はクリック イベントとしてホバーをサポートしています。

<ul>
    <li><a href="">Click me</a>
        <ul>
            <li>This is showed when Click Me! is clicked.</li>
        </ul>
    </li>

li:hover ul {display: block;}
于 2013-09-21T22:07:59.690 に答える