Html kodu gayet basit :
<p>
<a href="#">Hover Me!
<span>I'm a popup...</span>
</a>
</p>
popupun kodunu span elemanin içine koyun
CSS böyle yazilir :
a{
color:#ccc;
text-shadow:0 -1px 0 black;
}
a:hover,a:focus{
background:rgba(0,0,0,.4);
box-shadow:0 1px 0 rgba(255,255,255,.4);
}
a span{
position:absolute;
margin-top:23px;
margin-left:-35px;
color:#09c;
background:rgba(0,0,0,.9);
padding:15px;
border-radius:3px;
box-shadow:0 0 2px rgba(0,0,0,.5);
transform:scale(0) rotate(-12deg);
transition:all .25s;
opacity:0;
}
a:hover span, a:focus span{
transform:scale(1) rotate(0);
opacity:1;
}
Firefox ve Chromeda iyi çalışıyor
tek sorunu IE de popup açılmıyor.
gösteri için özel sitemin adresini koyardim ama forumda yeni oldugum için olmuyor!