Tooltip без jQuery/Javascript
31-10-2012
<a href="#" class="tip">Link<span>Съдържание на текста в tooltip-a</span></a>



Този ред е елементарен линк със клас tip в който има span който не можем да видим докато не поставим курсора върху линка (Link)

За да направим текста да е видим при hover (поставяне на курсора както вече споменах)
ще използваме кратък css код:

<style>
a.tip:hover {
position: relative
}
a.tip span {/*skriwame teksta vyv span tagovete*/
display: none
}
a.tip:hover span {/*pri postavqne na mishkata varhu tekxta , moje da redaktirate po vash vkus*/
border: #ddd 1px solid;
padding: 5px 20px 5px 5px;
display: block;
z-index: 100;
background: #333;
left: 0px;
margin: 10px;
width: 250px;
position: absolute;
top: 10px;
color:#ccc;
}
</style>

Може да видите демо,като копирате 2-та кода и ги поставите в html файл!



/ Трябва да сте регистриран за да напишете коментар /
От: Hous
9:16 01-11-2012
Едно демо [url=http://tooltip-no-js.free.bg/]ТУК[/url]
От: oveRLuckEd
9:06 02-11-2012
Супер е, браво! :)
1