Css 单击后的图像滚动（活动）_Css

Css 单击后的图像滚动（活动）

css

Css 单击后的图像滚动（活动）,css,Css,我正在做一个有3个阶段（正常、悬停、活动）的图像按钮翻转。我有正常和悬停阶段的工作，但我似乎无法让'积极'的工作。也就是说，我希望图像在被单击后保持在活动控制杆上以下是我所拥有的：谢谢！：）在单击事件时使用jQuery addClass在单击事件时使用jQuery addClass您尝试执行的操作将需要JavaScript。您的CSS很好，但是当链接不再处于活动状态时，：active选择器将不再适用，您对此无能为力您可以（例如）使用JavaScript通过向标记添加额外的CSS类来响

我正在做一个有3个阶段（正常、悬停、活动）的图像按钮翻转。我有正常和悬停阶段的工作，但我似乎无法让'积极'的工作。也就是说，我希望图像在被单击后保持在活动控制杆上

以下是我所拥有的：

谢谢！：）

在单击事件时使用jQuery addClass

您尝试执行的操作将需要JavaScript。您的CSS很好，但是当链接不再处于活动状态时，

：active

选择器将不再适用，您对此无能为力

您可以（例如）使用JavaScript通过向标记添加额外的CSS类来响应单击事件，并使用该类为链接设置与

：active

链接相同的样式。例如，如果JS添加了类“clicked”，那么您的规则可能如下所示

#emailUs:active, #emailUs.clicked
{
  background-position: 0 -62px;
}

许多（大多数？）开发人员可能会使用jQuery来实现类似的功能。

您尝试执行的操作将需要JavaScript。您的CSS很好，但是当链接不再处于活动状态时，

：active

选择器将不再适用，您对此无能为力

您可以（例如）使用JavaScript通过向标记添加额外的CSS类来响应单击事件，并使用该类为链接设置与

：active

链接相同的样式。例如，如果JS添加了类“clicked”，那么您的规则可能如下所示

#emailUs:active, #emailUs.clicked
{
  background-position: 0 -62px;
}

许多（大多数？）开发人员可能会使用jQuery来实现类似的功能。

如果可以使用JavaScript，这将非常简单。提出一些类名（例如，

active

），并将其添加到您的

：active

声明中：

#emailUs:active, .active
{
    background-position: 0 -62px;
}

然后使用JavaScript侦听该链接上的

单击

事件，阻止默认操作，并根据需要从元素中添加/删除

活动

类

然而，如果JavaScript不被允许，那么有一种更混乱的方式来获取您想要的内容，这在一个实时站点上可能是不可行的

更改链接的

href

，使其指向自身：

<a id="emailUs" href="#emailUs" title="Email Us"></a>

请记住，第二种解决方案有一些附带的注意事项：

它尝试重新定位页面，使链接位于屏幕顶部

如果您已经在站点上使用了片段标识符，那么可能会出现一系列问题

它在IE6-8中根本不起作用

如果您可以使用JavaScript，这将很简单。提出一些类名（例如，

active