javascript - 如何在主干悬停时让项目变得可见？

Question

当用户滚动视图时，我试图让视图变得可见，但我遇到了麻烦。这是视图：

events: {
  "mouseenter": "showOptions",
  "mouseleave": "hideOptions",
},

showOptions: function() {
  $(this.el).find(".update-delete").addClass("visible");
},

hideOptions: function() {
  $(this.el).find(".update-delete").removeClass("visible");
},

这是相关的CSS：

.update-delete {
  display: inline-block;
  margin-left: 5px;
  font-weight: bold;
  color: #777777;
  visibility: hidden;
}

.visibile {
  visibility: visible;
}

该类最初设置为具有隐藏的可见性。但是，在悬停时，可见性不会改变。

Answer 1

我会摆脱visibilitycss 并使用display，$.show/hide而是：

.update-delete {
  display: inline-block;
  margin-left: 5px;
  font-weight: bold;
  color: #777777;
  display: none;
}

showOptions: function() {
  $(this.el).find(".update-delete").show()
},

hideOptions: function() {
  $(this.el).find(".update-delete").hide();
},

如果您必须能见度，请先尝试以下操作：

showOptions: function() {
  $(this.el).find(".update-delete").css('visibility', 'visible');
},

hideOptions: function() {
  $(this.el).find(".update-delete").css('visibility', 'hidden');
},

如果可行，那么适应您的代码应该很简单。