html - 使用 Angular 微调器设置固定的顶部位置

Question

HTML

<div class="margin-top-10">
      <span us-spinner="{left: '91.6%',top:'74.2%',length: 5,width: 2,radius:4}" spinner-key="spinner-1"></span>
      <button class="btn btn-green" ng-click="">Send</button>
    </div>

我用过angular spinner如上所示。它工作正常。但我的问题是如何设置微调器始终随按钮(发送)移动。此时，当我在页面上添加一些内容时，我必须调整 top每次微调器的属性。那么你能告诉我如何避免这种情况并将它一直设置在按钮之上吗？提前致谢。

Answer 1

让微调器的父 div 有一个 position:relative 然后它的位置是基于那个父 div

<div class="margin-top-10" style="position:relative;">
    <span us-spinner="{left: '91.6%',top:'74.2%',length: 5,width: 2,radius:4}" spinner-key="spinner-1"></span>
    <button class="btn btn-green" ng-click="">Send</button>
</div>

或者您甚至可以尝试将 us-spinner 放在 <button> 中

<div class="margin-top-10">
    <button class="btn btn-green" style="position:relative;" ng-click="">
        <span us-spinner="{left: '91.6%',top:'74.2%',length: 5,width: 2,radius:4}" spinner-key="spinner-1"></span>
        Send
    </button>
</div>