diff --git a/src/image/ImagePointThread.js b/src/image/ImagePointThread.js index 606ebf331..b5a026671 100644 --- a/src/image/ImagePointThread.js +++ b/src/image/ImagePointThread.js @@ -13,6 +13,17 @@ import { } from '../constants'; class ImagePointThread extends AnnotationThread { + /** + * Gets the popover parent for image point threads. The popover parent + * should be not the image element but rather the annotatedElement + * + * @override + * @return {HTMLElement} The correct parent based on mobile view or not + */ + getPopoverParent() { + return shouldDisplayMobileUI(this.container) ? this.container : this.annotatedElement; + } + /** @inheritdoc */ show() { const [browserX, browserY] = getBrowserCoordinatesFromLocation(this.location, this.annotatedElement); @@ -50,9 +61,8 @@ class ImagePointThread extends AnnotationThread { const flippedPopoverOffset = isUpperHalf ? 0 : popoverEl.getBoundingClientRect().height + - POINT_ANNOTATION_ICON_HEIGHT + - ANNOTATION_POPOVER_CARET_HEIGHT + - POINT_ANNOTATION_ICON_DOT_HEIGHT; + POINT_ANNOTATION_ICON_DOT_HEIGHT * 2 + + ANNOTATION_POPOVER_CARET_HEIGHT; const dialogTopY = this.element.offsetTop + diff --git a/src/image/__tests__/ImagePointThread-test.js b/src/image/__tests__/ImagePointThread-test.js index 1dee26e68..e84b0920a 100644 --- a/src/image/__tests__/ImagePointThread-test.js +++ b/src/image/__tests__/ImagePointThread-test.js @@ -13,16 +13,24 @@ const html = `