5

：hover要素をダブルタップ（iPhoneの場合）して、javascriptを使用せずに、単純なcss：hover疑似クラスで追加情報を表示します。別の：hover要素をタップした場合にのみ、：hoverに表示されるdivが消えないという問題があります。iOSで：hover-機能が変更されましたか？

li.to-be-hovered {
  position:relative;
}
li.to-be-hovered div.hidden {
  display:none;
}
li.to-be-hovered:hover div.hidden {
  display:block;
  position:absolute;
}

そして、幅、上、左、マージン、背景、z-indexなどのようなもの...

<div>
  <ul>
    <li class="to-be-hovered">
      <div class="hidden">
        lots of extra information with image, span, link elements
      </div>
    </li>
  </ul>
</div>

私のiPhone（4S）では、div.hiddenはdiv.to-be-hoveredの最初のタブに表示されますが、要素の外側のどこかをタップしても消えなくなります。誰かがこの効果を知っていますか？純粋なCSSで再び消えさせることは可能ですか、それともこれらすべての要素にJavascriptを使用する必要がありますか？

4

2 に答える 2

0

JS:

var hidestuff = function() {
    // Hide lots of extra information with image, span, link elements
    // $(elm).hide();
}

$('html').touch(hidestuff).click(hidestuff);

CSS:

.hidestuff { position: absolute; z-index:1}

そのため、ユーザーがタップする必要のある要素以外の場所をタップすると、「隠し要素」が非表示になります

お役に立てれば ：/

于 2013-08-02T01:26:19.563 に答える