Question

我正在使用Ionic Framework。如果在移动设备上点按某个项目，我怎么能显示background-color更改或类似内容？如果您只是点击该项目，则下面的所有状态（活动，焦点等）都不会显示，但如果您按住手指则会显示。这不是通缉行为，因为它并没有真正向用户表明他/她已经点击了元素并且应该发生某些事情（即视图应该改变/即将改变）。

CSS：

.item-thumbnail-right {
  background-color: #FFFFFF;
}

.item-thumbnail-right:active,
.item-thumbnail-right:focus,
.item-thumbnail-right.active {
  background-color: #CCCCCC;
}

HTML：

<div class="item item-thumbnail-right">
  <div class="img-wrapper">
    <div class="img" src="img.jpg"></div>
  </div>
  <h2 class="title">Title</h2>
  <p>Text lorem ipsum...</p>
</div>

我应该使用Ionics on-tap指令添加一个类并相应地显示不同的background-color吗？如果它保留在视图缓存中，我应该在某些时候删除它。

Answer 1

好像我的active类错了。 Ionic在点击/点击的项目中添加了一个类activated，因此我尝试的工作正常，但该类必须是activated，如下所示：

.item-thumbnail-right {
  background-color: #FFFFFF;
}

.item-thumbnail-right.activated {
  background-color: #CCCCCC;
}

突出显示Ionic Framework中的clicked / tapped元素

1 个答案: