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

Incredible Demos

  • By
    CSS Scoped Styles

    There are plenty of awesome new attributes we've gotten during the HTML5 revolution:  placeholder, download, hidden, and more.  Each of these attributes provides us a different level of control over an element on the page, but there's a new element attribute that allows...

  • By
    TextboxList for MooTools and jQuery by Guillermo Rauch

    I'll be honest with you: I still haven't figured out if I like my MooTools teammate Guillermo Rauch. He's got a lot stacked up against him. He's from Argentina so I get IM'ed about 10 times a day about how great Lionel...

Discussion

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