Improve tooltip behaviour
This commit is contained in:
parent
e7610b2467
commit
8c4662e6e5
|
@ -39,7 +39,7 @@ export default defineComponent({
|
||||||
const contentHeight = this.$refs.content.offsetHeight;
|
const contentHeight = this.$refs.content.offsetHeight;
|
||||||
|
|
||||||
let left = rect.left + window.pageXOffset + (this.source.offsetWidth / 2);
|
let left = rect.left + window.pageXOffset + (this.source.offsetWidth / 2);
|
||||||
let top = rect.top + window.pageYOffset + this.source.offsetHeight;
|
let top = rect.top + window.pageYOffset - contentHeight;
|
||||||
|
|
||||||
left -= (this.$el.offsetWidth / 2);
|
left -= (this.$el.offsetWidth / 2);
|
||||||
|
|
||||||
|
@ -47,9 +47,9 @@ export default defineComponent({
|
||||||
left = window.innerWidth - contentWidth + window.pageXOffset - 1;
|
left = window.innerWidth - contentWidth + window.pageXOffset - 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
if (top + contentHeight - window.pageYOffset > window.innerHeight) {
|
if (top - window.pageYOffset < 0) {
|
||||||
top = rect.top + window.pageYOffset - contentHeight;
|
top = rect.top + window.pageYOffset + this.source.offsetHeight;
|
||||||
this.$refs.content.style.transformOrigin = 'center bottom';
|
this.$refs.content.style.transformOrigin = 'center top';
|
||||||
}
|
}
|
||||||
|
|
||||||
this.$el.style.left = left + 'px';
|
this.$el.style.left = left + 'px';
|
||||||
|
@ -81,6 +81,6 @@ export default defineComponent({
|
||||||
text-align: center;
|
text-align: center;
|
||||||
border-radius: 4px;
|
border-radius: 4px;
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
transform-origin: center top;
|
transform-origin: center bottom;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
Loading…
Reference in New Issue