This is an awesome trick for hiding your e-mail address e-mail harvesting bots.
HTML
<span class="fu-spammers">moc.elpmaxe@sirhc</span>CSS
.fu-spammers {
direction: rtl;
unicode-bidi:bidi-override;
} The result: moc.elpmaxe@sirhc
- Edit: I did not say this method was particularly useful, just cool.
+ Edit2: Oh, hang on it would be useful if we make the link clickable with jQuery
$(document).ready(function() {
$('span.fu-spammers').each(function(){
var mail = $(this).html();
$(this).html('<a href="mailto:'+mail.split("").reverse().join("")+'" rel="nofollow">'+mail+'</a>');
});
});The result: moc.elpmaxe@sirhc
Ok, so for it to be useful, it's not pure CSS. With the jQuery we have a nice solution which degrades gracefully. So if there's no JS then it's still readable, just not clickable.
All is well except for accessibility but thats another issue.
Please comment with improvements, suggestions.
Submitted by Chris Herberte on Tue, 2009-11-03 15:16

Very cool and unconventional.
Very cool and unconventional. However, I usually use http://www.spamspan.com for hiding emails on my sites.
It even has a drupal module, http://drupal.org/project/spamspan
Post new comment