ImageMap shouldnʼt prevent image resizing — if only browsers could sync image map
Closed, DeclinedPublic
Actions

Assigned To

None

Authored By

	Hnvnc
	Feb 27 2018, 4:56 AM

Description

When using ImageMap, usually resized images stay fixed, because the plugin wraps them in a noresize div. That disrupts user experience whenever a map is added to a preexisting image benefitting from a "max-width:100%" rule.

Iʼm bothered since trying to add an image map to the layout chart on http://bepo.fr/wiki/Accueil
The image sbould stay resizing, but here is all I could get: http://bepo.fr/wiki/Mod%C3%A8le:CarteB%C3%A9poHoverInfo
In https://en.wikipedia.org/wiki/German_keyboard_layout#General_information the image is wrapped in a noresize div, too.

ImageMap already resizes coordinates, as https://www.mediawiki.org/wiki/Extension:ImageMap#Syntax_description specifies that the coordinates in the wikicode must correspond to the full-size image, not to the visible image. But once in the browser, only JavaScript seems to be able to sync an imagemap with a resized image, https://stackoverflow.com/questions/13321067/dynamically-resizing-image-maps-and-images
See also: https://github.com/jamietre/ImageMapster/issues/42

Might the ImageMap plugin add such a script, too?

Basically the issue seems to be faulty HTML spec. Not automatically scaling an image map in accordance with the related image makes no sense.

Thanks for fixing, if anything can be done here.

Event Timeline

Hnvnc created this task.Feb 27 2018, 4:56 AM

Restricted Application added a subscriber: Aklapper. · View Herald TranscriptFeb 27 2018, 4:56 AM

Hnvnc renamed this task from ImageMap shouldnʼt prevent image resizing to ImageMap shouldnʼt prevent image resizing — if only browsers could sync image map.Feb 27 2018, 5:01 AM

Hnvnc triaged this task as High priority.

Hnvnc updated the task description. (Show Details)

Hnvnc updated the task description. (Show Details)Feb 27 2018, 5:03 AM

Hnvnc updated the task description. (Show Details)Feb 27 2018, 5:09 AM

Hnvnc updated the task description. (Show Details)Feb 27 2018, 5:14 AM

Hi @Hnvnc, thanks for taking the time to report this.

I am not sure what "The image should stay resizing" means exactly. It's welcome to cover expected and actual outcome, plus exact version information of MediaWiki and the ImageMap extension. Please follow https://mediawiki.org/wiki/How_to_report_a_bug which was linked at the top of the bug reporting form.
Resetting priority to default.

Hi @Aklapper, thank you for taking a glance, and sorry for having set high priority. By contrast, Iʼve read through the guidelines, just failed wording correctly.

The linked website is powered by MediaWiki and the plugin is functional. Although being unaware of the version numbers, we can suppose theyʼre latest, as the site is hosted by TuxFamily.

I am not sure what "The image should stay resizing" means exactly.

To avoid hidden overflow, on the BÉPO website images adapt by default to the browser window, due to img {max-width: 100%}. The image to map is in the first place, on the home page. Thus it must stay resizing automatically, in order to maintain UX. Conversely, to enhance UX, it should have tooltips that help identifying characters.

Now the HTML spec seems not to prescribe that the browser resize an image map when resizing the image itself. Therefore, ImageMap wraps the image in a <div class="noresize">.

A workaround uses JavaScript. Expected outcome is that ImageMap embeds such a script (until W3C publishes an appropriate recommendation and browsers are updated).

Thanks for the quick answer! Could you please provide exact version info of MediaWiki and the ImageMap extension? Special:Version should display them.

Thanks for the hint! According to http://bepo.fr/wiki/Sp%C3%A9cial:Version the version of MediaWiki utilized is 1.22.6, while the ImageMap extension is just reported as “installed.”

Sorry for the delay.

Thanks. Version 1.22 has been unsupported since 2014 so I'm closing this task as invalid. For your own safety (given 1.22 should have many security vulnerabilities by now) I'd recommend upgrading. Feel free to reopen if this problem still happens in a supported version. For general support, please refer to Support desk. Thanks!

Thanks a lot! Iʼm baffled to see that outdate shortcoming. Anyhow Iʼve now messed around with the HTML source code for a short wile and tested also in my up-to-date version of Chrome (64.0.3282.186): After removing the "noresize" pseudoclass, I can add the "max-width:100%" rule wherever I want, nothing helps. The coordinates in the <area> elements donʼt scale when the image resizes.

So Iʼd suggest that for now there is not much more to do than to file a bug to the W3C. Upgrading MediaWiki probably wonʼt have any incidence on that bug that is on browser side and needs to be fixed on the basis of a W3C recommendation. (Admittedly it shouldnʼt occur even without this.)

Of course the local WikiMedia copy shall be upgraded. Thanks a lot for the hint! That will finally be the most valuable outcome of this issue.

Cheers.

ImageMap shouldnʼt prevent image resizing — if only browsers could sync image mapClosed, DeclinedPublicActions

Description

Event Timeline

ImageMap shouldnʼt prevent image resizing — if only browsers could sync image map
Closed, DeclinedPublic
Actions