0

iOS と Android および WP7 モバイル ブラウザーで作成したページをテストしていたところ、iOS では css ホバー イベントが発生しないことがわかりましたが、Android と WP7 では動作します。これがなぜなのか、誰かがたまたま知っているでしょうか?これが私が使用しているCSSです。

ありがとうございました

.tooltip
{   
    position: absolute;
    display: block;
    visibility: collapse;
    z-index: 2;
    width: 190px;
    height: 163px;
    opacity: 0;
    color: #777;
    background-color:#fff;
    top: -20px;
    left: -20px;
    padding: 0px 0px 0px 0px;
    line-height: 25px;
    border-radius: 0px 0px 0px 0px;
    -moz-transition-property: opacity, visibility;
    -moz-transition-duration: 0.3s, 0.1s;
    -webkit-transition-property: opacity, visibility;
    -webkit-transition-duration: 0.3s, 0.1s;
    box-shadow: -1px -1px 4px rgba(0, 0, 0, 0.3);


}

 .hover-image:hover .tooltip
{
    opacity: 1;
    visibility: visible;
}

そしてそれが影響している要素

<figure class="hover-image">
        <div><p class="notice">hover on me</p>[AlbumLogoSource]</div>
    <p class="item-title">[SGSV:Value:AlbumTitle]</p>   
        <figcaption class="tooltip">
            <ul class="tooltip-inner">

                <li><a href="/mypage">
                    <div class="inner-item-logo">[AlbumLogoSource2]</div></a></li>
                <li>
                    <ul class="tooltip-menu">

                        <li><a href="/view">view</a></li>

                        <li><a href="/upload">upload</a></li>

                    </ul>
                </li>
            </ul>

        </figcaption>
    </figure>
4

0 に答える 0