Question

当用户点击按钮时......

#featured-challenge-button {
  background-color: #446CB3;
  box-shadow: 3px 3px 5px black;
  &:hover {
    background-color: #ccac00;
    box-shadow: none; 
  }
  &:active {
    background-color: #ccac00;
    box-shadow: none; 
  }
  &:focus {
    background-color: #ccac00;
    box-shadow: none; 
  }
}

按钮示例：

# link_to
<%= link_to next_challenge_path, class: "btn", id: "featured-challenge-button" do %>
  <span class="glyphicon glyphicon-plus"></span>
<% end %>

# submit
<%= button_tag(type: 'submit', class: "btn", id: "featured-challenge-button")  do %>
  Save
<% end %>

如何显示它立即被按下？

在浏览器上它可以正常工作，但在我的iPhone上点击时对按钮没有任何影响。单击按钮的唯一指示是屏幕顶部的加载栏。

我使用:active错了还是有其他CSS技术还是有javascript解决方案？

Answer 1

您需要在按钮上使用ontouchstart事件。只需使用

ontouchstart=""在您的元素上:active将起作用。

<button ontouchstart="">An Example</button>

在移动设备上激活按钮？

1 个答案: