MediaWiki talk:Gadget-ReferenceTooltips.js: Difference between revisions
Content deleted Content added
→Update request 9 July 2024: Reply |
→Update request 9 July 2024: reply to Matma Rex |
||
Line 254:
:::::::I haven't looked at how it's used in Codex, but at least OOUI manages to use it to position not just dialogs, but also e.g. dropdown menus (like those on [[Special:Log]]).
:::::::You're right though that the position has to be calculated relative to the bottom of the screen… (I see things like <code>top: -2447.62px</code> on those OOUI dropdowns, which is a bit silly). I would guess nobody noticed because those libraries have generic methods to position anything relative to anything else, and they coped with the weirdness automatically. You might want to file a Phab task (and CC people who worked on the feature: https://gerrit.wikimedia.org/r/c/mediawiki/core/+/945825), or you'll have to make your code cope with it too. [[User:Matma Rex|Matma Rex]] <small>[[User talk:Matma Rex|talk]]</small> 16:57, 11 July 2024 (UTC)
::::::::Thanks for explaining. Apart from requiring negative offsets, it also has zero width which makes descendants shrink if they don't have explicitly set width, e.g. try <syntaxhighlight lang="js">
const topOffset = -$('#mw-teleport-target').offset().top + $(window).scrollTop();
$('#mw-teleport-target').append(`<div style="position: absolute; top: ${topOffset}px; background-color:yellow;">test test test</div>`);
</syntaxhighlight>So I'm afraid, unless you set <code>width: max-content</code> (which [https://developer.mozilla.org/en-US/docs/Web/CSS/max-content#browser_compatibility is] a bit newer than Grade C browsers), you can't have descendants with variable width also. [[User:JWBTH|Jack who built the house]] ([[User:JWBTH|talk]]) 17:49, 11 July 2024 (UTC)
::::<code>#mw-teleport-target</code> isn't served by HTML, so I assume you can't just expect it to be there but have to await something. [[User:Nardog|Nardog]] ([[User talk:Nardog|talk]]) 07:36, 10 July 2024 (UTC)
:::::https://phabricator.wikimedia.org/source/mediawiki/browse/master/resources/src/mediawiki.page.ready/ready.js<syntaxhighlight lang="js">
| |||