OPML Blogroll widget 1.3 for WordPress adds tooltips
April 17th, 2008 1:47:33 pm pst by 
Sterling Camden
Thanks to a suggestion from Diego, I have added tooltips to each entry in the OPML Blogroll widget for WordPress. These tooltips display the content of the “description” attribute of each outline entry, if one exists, when the user hovers the mouse over the entry.
Note that this is not an update to the OPML Browser plugin, although I plan to add the same feature to that plugin as well (along with a ton of other enhancements).
I used JavaScript to pop up and remove the Tooltips. I decided to roll my own (with much help from Shelley Powers’ book Adding Ajax) rather than use an existing library, in order to keep the widget lean and to avoid conflicts with other libraries that might be in use on your blog.
Thanks to Internet Explorer, this seemingly simple enhancement required about twice as much JavaScript code as as a Firefox/Opera/Safari-only version would have. Here are the differences that required special code for IE:
- Of course, events don’t get passed to event handlers. So you use window.event. No big deal.
- And we all know about addEventListener vs. attachEvent. Not a problem, just wrap it in a function.
- If you attach a property to a DOM object, lose the reference, and then reacquire that same element from the DOM later, it doesn’t have the property you added any more. Apparently IE gives you a new object each time. So in IE, this plugin has to look up the tooltip for the current item every time it wants to be displayed.
- Not having the “currentTarget” property on the Event object in IE really sucks. You can use “srcElement”, but it isn’t the same element as “currentTarget”. For instance, if you have a “mouseover” event on an element that contains a link around an image, “currentTarget” gives you the element on which the event was specified, whereas srcElement will give you whatever contained element the mouse was actually over. So this plugin accesses parentNode until it finds the one that’s meaningful.
Another nice “feature” of Internet Explorer keeps the tooltips from displaying at all in my theme – perhaps due to the use of float on nearby div’s. I tried the fix outlined here to no avail. It does work using the WordPress default theme, though, so there is hope. Let me know how it works with your theme.
I also fixed a problem with the auto-discovery link in which the ending quote on the href was missing. 
Linking to earlier versions for pingback.
UPDATE: 2009-05-11: I have incorporated all the features of this widget into my OPML Browser plugin version 2.0. Please upgrade (it’s free).
Posted in CSS, JavaScript, OPML, PHP, RSS, Web, WordPress | 
16 Comments » RSS 2.0 | Sphere it!
Subscribe by Email
[...] (4/17/08): The latest version of this plugin can be found here. Tags: Blogroll, OPML, PHP, phpopmlroll, widget, [...]
[...] UPDATE: Latest version here. [...]
[...] Latest version here. Tags: Blogroll, cache, feeddemon, OPML, opmlmanager, opmlworkstation, phpopmlroll, [...]
[...] OPML Blogroll widget 1.3 for WordPress adds tooltips — Chip’s Tips for Developers Because you can never annoy users too much with helpful popups. (tags: php javascript wordpress opml rss tooltips IE firefox safari opera widgets blogroll) [...]
[...] Excerpted from:OPML Blogroll widget 1.3 for WordPress adds tooltips [...]
OPML blogroll is one of my top 10 favorite wp plugins especially when you crosslink a ton of sites (like me).
Keep up the great work Chip!
I think you mean the OPML Browser plugin, don’t you Tony? The OPML Blogroll is the older form that supports a flat, sorted list.
I’m hoping to make OPML Browser flexible enough in the next version to do anything you can do with OPML Blogroll, in which case I’ll merge the two.
Thanks for the compliment, though!
(hanging head in shame)
Of course I meant the browser plugin – I saw OPML and was excited to see a new version.
(cough)OPML Browser is one of my top ten wp plugins.(/cough)
I hope to get a new version of the OPML Browser plugin done soon.
Thank you Chip! Great work. I will point my readers to your update!
Cheers,
Diego
Glad it meets your needs, Diego.
This one is great. Thanks for the idea.
My pleasure. For a different version that preserves the hierarchy of categories in the OPML file, and also allows them to be expanded/collapsed, see the OPML Browser Plugin.
Hello again Chip!
Just wondering if it would be possible to generate more than one instance of your OPML Blogroll widget by modifyng part of the code.
Do you think you could release a new update?
Thanks in advance!!!
Diego
Hi Diego. The OPML Browser plugin already supports multiple instances, if you can use that one. I’m planning a release in the future that will offer the capabilities of both the OPML Browser and OPML Blogroll plugins, but I’ve got to find the time to get it done. That one will definitely support multiple instances.
I just released version 2.0 of the OPML Browser, which includes all the features of the OPML Blogroll widget. Please upgrade to the OPML Browser and let me know if I missed anything.