Working Around MooTools’ Tips / Rel=”NoFollow” Bug

By  on  

In MooTools 1.2, we saw the format of the MooTools Tip go from:

<a href="somewhere.php" class="tooltip-me" title="Title::Text">Tooltip Link</a>

... to ...

<a href="somewhere.php" class="tooltip-me" title="Title" rel="Text">Tooltip Link</a>

The one problem that this brought was that sometimes you don't want a search engine to follow a link, in which case you would add the following to the link element:

<!-- where do we put the text? -->
<a href="somewhere.php" class="tooltip-me" title="Title" rel="nofollow">

Obviously there's a conflict here as no one wants "nofollow" to be their tooltip's text. There are a few solutions to this.

1. Remove & Replace the Rel Attribute Before Creating Tips

	
$each($$('.tooltip-me'),function(el) {
	el.set('rel',''); //removes it
	// or
	el.set('rel','This is my tooltip text');
});
	

It's up to you whether you'd like to replace the "nofollow" text or simply remove it.

2. Revert to Title::Text in the Title Attribute

$$('.tooltip-me').each(function(el) {  
	var content = el.get('title').split('::');  
	el.store('tip:title', content[0]);  
	el.store('tip:text', content[1]);  
}); 

I prefer this method and used it in my previous MooTools tooltips article. You can follow the progress of this open MooTools ticket here.

Recent Features

  • By
    CSS 3D Folding Animation

    Google Plus provides loads of inspiration for front-end developers, especially when it comes to the CSS and JavaScript wonders they create. Last year I duplicated their incredible PhotoStack effect with both MooTools and pure CSS; this time I'm going to duplicate...

  • By
    An Interview with Eric Meyer

    Your early CSS books were instrumental in pushing my love for front end technologies. What was it about CSS that you fell in love with and drove you to write about it? At first blush, it was the simplicity of it as compared to the table-and-spacer...

Incredible Demos

  • By
    Making the Firefox Logo from HTML

    When each new t-shirt means staving off laundry for yet another day, swag quickly becomes the most coveted perk at any tech company. Mozilla WebDev had pretty much everything going for it: brilliant people, interesting problems, awesome office. Everything except a t-shirt. That had to change. The basic...

  • By
    MooTools Clipboard Plugin

    The ability to place content into a user's clipboard can be extremely convenient for the user. Instead of clicking and dragging down what could be a lengthy document, the user can copy the contents of a specific area by a single click of a mouse.

Discussion

    Wrap your code in <pre class="{language}"></pre> tags, link to a GitHub gist, JSFiddle fiddle, or CodePen pen to embed!