html - jquery 移动自定义 css 问题与 a.class :hover

Question

我正在使用 jquery 移动框架 1.0，我正在尝试在下面的 a.grid-anchor 上使用 css :hover 实现渐变背景，但似乎无法让它工作。此 anchor 不使用 jq mobile data-role="button"。

<div data-role="content">   

    <div id="ri-grid" class="ui-grid-c">
        <div class="ui-block-a">
            <a class="grid-anchor" href="#page2" data-transistion="slide">
                <div class="ui-bar rm-box border-br">
                    <ul>
                        <li>Sample text</li>
                        <li>more ttxt...</span></li>
                        <li><div class="icon-ir"></div></li>
                    </ul>
                </div>
            </a>
        </div>...</snip>

CSS:

a.grid-anchor:hover {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0.65)), color-stop(100%,rgba(0,0,0,0))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%); /* Chrome10+,Safari5.1+ */
}

*仅在 safari 上使用

Answer 1

说到移动框架，为什么要尝试使用悬停。是否可以通过手机或触摸屏在 Hover 上触发该事件？建议不要使用悬停。尝试一些其他事件，例如 Mousedown 或 pointerdown 事件。