如何将“工具提示”位置调整到屏幕中央?

时间:2019-12-04 09:24:52

标签: html css angular tooltip

我在嵌入到页面iframe的页面上具有

表格元素的工具提示。当我想查看工具提示时,如果文本很长,则说明工具提示超出了框架的限制。 enter image description here

位置调整为“之后”:

<ng-container cdkColumnDef="budgetGroupName">
          <mat-header-cell *cdkHeaderCellDef fxFlex="20%">Budget Group</mat-header-cell>
          <mat-cell matTooltip="{{payroll.budgetGroupName}}" matTooltipPosition="after" *cdkCellDef="let payroll"
                    fxFlex="20%"><div class="wrapped-text">{{payroll.budgetGroupName}}</div></mat-cell>
        </ng-container>

我也尝试过“正确”,“上方”,但它们也将超出范围。我可以将其调整为例如“屏幕中心”或其他以更清晰地看到吗?或者我只需要使用这6个不同的选项来进行定位,例如右,左上,belove,之后,之前,之前,还是可以手动调整到屏幕中间?

或者,如果可能的话,如果有一个功能可以在工具提示文本上滚动,我也可以使用它来查看全部内容

2 个答案:

答案 0 :(得分:0)

这正是我上个月使用if(err){ console.log(err); }else{ console.log('Connected to DB'); } });所面临的问题,因为它不提供任何mat-tooltip支持,因此我想出了在所有情况下均能完美运行并完全自定义的解决方案-能够。 http://launch4j.sourceforge.net/docs.html

HTML

我也尝试了sat-popover,但有时会在随机位置上显示<button [satPopoverAnchor]='popover' (click)="popover.toggle()"> See Contact Details </button> <sat-popover #popover hasBackdrop> <app-contact-overview [contact]="myContact"></app-contact-overview> </sat-popover> ,因此我更喜欢使用tooltip

我还将这个问题发布到sat-popover ng2-tooltip-directive

答案 1 :(得分:0)