javascript - 在悬停时将按钮覆盖添加到链接图像

Question

我主要是一名后端工程师，所以如果这个问题有一个非常明显的答案，请原谅我，但我有一组图片，点击后可以导航到新页面。我正在尝试实现一种方法，以便将鼠标悬停在图像上会显示一个可以单击以触发模式弹出的按钮。我想知道是否有办法做到这一点，因为图像本身包含在 anchor 标记中。覆盖的按钮应该有一个 ng-click 属性

这是现有的代码。如果这是一个新手问题，再次抱歉。

<a ng-href="/{{similarCampaign.crossSellPath}}" ng-attr-title="{{similarCampaign.name}}">
  <img class="img-responsive" style="width: 150px" ng-src="{{similarCampaign.mockupUrlSmall}}" ng-attr-alt="{{similarCampaign.name}}" ng-attr-nopin="{{similarCampaign.stealthy ? 'nopin' : ''}}"/>
  <!-- button overlay of image above -->
</a>

Answer 1

用 position: relative 将所有内容包裹在一个 div 中，并在 a href 外部添加一个按钮，使用 position: absolute，然后将其居中放置在您想要的位置。