Mouse-over Broken!

Resolved mmallett
(@mmallett)

5 years, 5 months ago

I am running two separate websites. On both of them, the Mouse-over box no longer pops-up the text. Others are reporting this as well.

The page I need help with: [log in to see the link]

Viewing 15 replies - 1 through 15 (of 31 total)

1 2 3 →

Thread Starter mmallett
(@mmallett)

5 years, 4 months ago

Is the developer no longer supporting this plugin? This basic and important feature is broken for many individuals, but there’s been no response…
vishae
(@vishae)

5 years, 4 months ago
I also notice that the mouse-over box is no longer showing.

I’m hoping this gets fixed soon.
- This reply was modified 5 years, 4 months ago by vishae.
Plugin Contributor pewgeuges
(@pewgeuges)

5 years, 4 months ago

I’m sorry for the trouble you are experiencing. The plugin’s homepage on WordPress.org is featuring a call for developers made in August 2019. So far I’ve sent a pull request and an email to the plugin’s author.

@mmallett, as I can see from your linked website, meanwhile you switched to footnotes-made-easy. This plugin displays reliable HTML tooltips. By contrast, the footnotes plugin uses jQuery and needs JavaScript enabled to work.

@mmallett, @vishae, the tooltip infobox of footnotes is properly displaying on all my sites, both a blog online and a localhost WordPress sandbox, I never encountered that bug. May you please disable all other plugins, enable JavaScript, and make sure the tooltip infobox is enabled in footnotes?

Hopefully that will unveil the bug’s nature.

Plugin Contributor pewgeuges
(@pewgeuges)

5 years, 4 months ago

@mmallett, @vishae, I apologize for my misdiagnose, and acknowledge the outdated jQuery library.

I’m sorry for the outage and the troubles you went through.

footnotes is now fixed and available in its today’s v2.0.0 release.

Thanks for using footnotes.

Thread Starter mmallett
(@mmallett)

5 years, 4 months ago

Thanks for the update. It’s working on one blog but not another.

On the one that is working, however, an underscore line is appearing under the footnote. See: https://www.markmallett.com/blog/dear-holy-father-he-is-coming/

Thread Starter mmallett
(@mmallett)

5 years, 4 months ago

Okay, so this is what I’ve found.

– In Safari, the footnote looks correct: it is superscript and no line underscore.

– In Firefox, the footnote is not superscript and has the underscore.

– In Google-based browsers, there is no superscript and no underscore.

This is not happening with another footnotes plugin I’m testing.

Plugin Contributor pewgeuges
(@pewgeuges)

5 years, 4 months ago

I’ve immediately disabled underline on footnote anchors from the footnotes plugin, but only to notice in the wake that the website you linked uses Footnotes Made Easy.

However should you wish to try out the footnotes plugin as well, please wait for a bugfix release scheduled for this morning. The urgency yesterday led to overlook that the expand/collapse button next to the reference container label is missing. It will be restored.

For instance, the Chrome inspector tells that the underline is due to the user agent stylesheet. The moving behavior is the reason those things need to be explicitly defined, so it’s a good idea to add rules proactively.
Plugin Contributor pewgeuges
(@pewgeuges)

5 years, 4 months ago
Hi @mmallett,

Thanks for raising awareness. For an ad-hoc solution, please try adding these rules to the embedded custom CSS:
```
a.footnote-link, 
a.footnote-identifier-link {
  text-decoration: none;
}
```
That removes the underline in default view. (These classes are assigned to <a< elements, the a can be omitted.)

Beyond default appearance, I also strongly recommend to give your visitors a sense of what interactivity is provided. Whenever an area is mouse-hovered, if that area triggers an action on click, it should change appearance on hover beside the mouse pointer changing shape. I’d suggest both a change in text decoration and in color:
```
a.footnote-link:hover, 
a.footnote-identifier-link:hover {
  text-decoration: underline;
  color: #000066;
}
```
The color #000066 accounts for the colored background, that light colors might hardly stand out on. The lower the figure, the darker the blue.

This affects both footnote anchors in the text, and footnote IDs with backlink in the footnotes list. To affect only the former, delete .footnote-link from this code, but I don’t advise to do so, as the same principles hold true in the footnotes list.

If that doesn’t meet your expectations, please feel free to report further issues and to ask also our friend David Artiss, author of Footnotes Made Easy, who contributed to our footnotes plugin as well:

https://wordpress.org/support/plugin/footnotes-made-easy/

Kind regards.
- This reply was modified 5 years, 4 months ago by pewgeuges.
- This reply was modified 5 years, 4 months ago by pewgeuges.
- This reply was modified 5 years, 4 months ago by pewgeuges.
- This reply was modified 5 years, 4 months ago by pewgeuges.
Plugin Contributor David Artiss
(@dartiss)

5 years, 4 months ago

Thanks.

Yes, happy to help but, please, raise this over on the forum for Footnotes Made Easy.

Thread Starter mmallett
(@mmallett)

5 years, 4 months ago

Hi there. Thanks for looking into all this. Yes, sorry, I turned off footnotes momentarily to test Footnotes Made Easy, which is probably when you came to my site.

Under version 2.02:

– Popups work in Firefox, Vivaldi and Google-based browsers
– They quit working in this version for Safari

Also, there is now quite an indent after the footnote reference at the bottom of the page. That is new. Also, the arrow symbol that used to be beside the number is gone, so it’s not obvious the person can click the number to go back up.

Regarding the appearance:

– In Vivaldi, the footnote is not superscript
– In Safari, it is superscript
– In Firefox, no superscript
– In Opera, no superscript
Plugin Contributor pewgeuges
(@pewgeuges)

5 years, 4 months ago
Hi @mmallett,

Thank you for reporting what’s going on in Safari.

Sorry for the indent, that came in as part of fixing display of multiple identical notes with numerous IDs before a note text. This is going to be fixed.

The backlink symbol has been removed after moving the backlink on the number, because those arrows looked unprofessional, especially when displayed before the note text, thus next to the number. Moreover, the backlink is now in the entire table cell where the number is in, no need to point precisely the number or a (big or tiny) arrow to get back upscreen. The full rationale is available at https://github.com/media-competence-institute/footnotes#most-visible-enhancement

Your feedback brings however the need for an optional arrow after the number.

The footnote anchors’ vertical alignment is as expected in Chrome. Thank you for reporting the bug in other browsers, that apparently are unable to parse this CSS code:
```
	vertical-align: top !important;
	position: relative !important;
	top: 0.6em !important;
```
The footnote anchors are bracketed with <sup></sup> tags and positioned relatively by a value in em measured from top. For v1.6.5, the footnote anchors were raised from 0.7em (too low) to 0.4em. If in v1.6.4 they were considered too high, the number should be 0.8em, but that is even lower than the ascender height in WordPress’ Twentytwenty theme. 0.6em is more correct, it makes the anchors’ baseline sit at half x-height. But if all that doesn’t work in other browsers we need to find a more cross-browser-compatible way of superscripting.

The thread is marked as unresolved again, until all these issues are solved.

Thank you.
- This reply was modified 5 years, 4 months ago by pewgeuges.
- This reply was modified 5 years, 4 months ago by pewgeuges.
- This reply was modified 5 years, 4 months ago by pewgeuges.
Plugin Contributor pewgeuges
(@pewgeuges)

5 years, 4 months ago

Among the above, the indent is being fixed in the up-coming bugfix release through self-adjusting width of ID column but hidden overflow; a transitional arrow will be prepended to the footnote numbers in the container (it will be customizable again when the setting is restored); but the superscript display cannot be fixed because Firefox does not show that disorder when I look at it with an MCI footnotes-using web page, given basically it is plain HTML and the three quoted CSS rules do nearly nothing.
Plugin Contributor pewgeuges
(@pewgeuges)

5 years, 4 months ago
Hi,

In upcoming v2.0.4 the arrow setting is coming back again and can be used to disable the arrow as well. The position of the symbol however remains prepended, not taking up a column.

The indent is being further diminished by ruling out most of left/right cell padding.

About the topic, jQuery UI will now be supported natively.

I think this thread should be marked as solved with respect to the issue discussed, although I’m saddened that a browser version does not interact well with the libraries used in the plugin.

Best regards,
@pewgeuges
- This reply was modified 5 years, 4 months ago by pewgeuges.
- This reply was modified 5 years, 4 months ago by pewgeuges.
Plugin Contributor pewgeuges
(@pewgeuges)

5 years, 4 months ago

Hello @mmallett,

We just found the superscript problem and deleted the quoted three rules to fix it in upcoming v2.0.6:

https://wordpress.org/support/topic/change-the-position-5/#post-13615862

Thank you very much for raising our awareness that longlasting style rules are proving inefficient and counter-productive, annihilating <sup> in some browser and even (cross-browser) in widely used and much appreciated themes.

Best regards,
@pewgeuges

Thread Starter mmallett
(@mmallett)

5 years, 4 months ago

Hi there.

Whatever you have done on your end recently, the footnotes no longer appear at the bottom of the page! I’ve checked this in several browsers.

Viewing 15 replies - 1 through 15 (of 31 total)

1 2 3 →

The topic ‘Mouse-over Broken!’ is closed to new replies.