改变背景位置onclick

Question

我有一个锚<a>，我将其用作按钮。 我正在使用精灵使按钮根据鼠标事件改变其形状。 从正常到悬停，它正在工作。我改变了不透明度，如下面的代码所示。 问题是单击按钮时（从悬停到单击）。我希望背景位置从46％滑动到51％以显示精灵的另一部分。 我尝试了before，after，focus ......但是徒劳无功。你的帮助是适当的。

.left_arrow_trigger
{
    height:100%; 
    width:100%;
    display: block;
    background: url('../images/dashboard_sprite.png') no-repeat;
    background-position:0 46%; 
    background-size: 1500% 1700%;
    opacity:.41;

}

.left_arrow_trigger:hover
{
    opacity:.90;
}

.left_arrow_trigger:focus 
{
background-position:0 51%; 

}

Answer 1

试试这个：

.left_arrow_trigger:active 
{
  background-position:0 51%; 
}