Оригинальная идея, улучшающая юзабилити сайта.

JavaScript

<br />
$().ready(function(){<br />
$(".rss-popup a").hover(function() {<br />
$(this).next("em").stop(true, true).animate({opacity: "show", top: "-60"}, "slow");<br />
}, function() {<br />
$(this).next("em").animate({opacity: "hide", top: "-70"}, "fast");<br />
});<br />
});

HTML

</p>
<div class="rss-popup">
<a href="feed-link" id="rss-icon">RSS Feed</a><br />
<em>Subscribe to our RSS Feed</em>
</div>
<p>

CSS

.rss-popup {
margin: 100px auto;
padding: 0;
width: 100px;
position: relative;
}

div.rss-popup em {
background: url(bubble.png) no-repeat;
width: 100px;
height: 49px;
position: absolute;
top: -70px;
left: -0px;
text-align: center;
text-indent: -9999px;
z-index: 2;
display: none;
}

#rss-icon {
width: 42px;
height: 42px;
background: url(icon.png) no-repeat 0 0;
text-indent: -9999px;
margin: 0 auto;
display: block;
}

Теперь, сохраним все это и посмотрим на результат. Этот эффект можно применять не только к RSS-ленте, но и ко многим другим иконкам.

Источник.

Добавить в социальные закладки

• Blink
• del.ici.ous
• Digg
• Furl
• Google
• Simpy
• Spurl
• Y! MyWeb
• БобрДобр
• Мистер Вонг
• Яндекс.Закладки
• Текст 2.0
• News2
• AddScoop
• RuSpace
• RUmarkz
• Memori
• Закладки Google
• Писали
• СМИ 2
• Моё Место
• Сто Закладок
• Ваау!
• Technorati
• RuCity
• LinkStore
• NewsLand