Invisible   Text   Rollover


Wie die folgende Beispiele kannst du einen "Link-Text" oder "Grafik-Link" auf dein Profil einfügen, so daß wenn mit der Maus darüber gerollt wird, ein verborgener Text erscheint.

Achte darauf, der Code besteht aus 2 Teilen.

Like the following examples, you can insert a "Textlink" or a "Graphiclink" on your profile, and when the mouse hovers over it a hidden text will show up.

- Notice that the code consist of 2 parts.







"Hover On This Link To See The Effect ↑" http://khak-myspace.blogspot.com

° ↑ Examples ↓ °


"Hover On This Image To See The Effect ↑"

http://khak-myspace.blogspot.com


║║║  ║║  ║  ║║  ║║║

║║║  ║║  ║  ║║  ║║║


° CSS Part Of The Code °

<style type="text/css">
.K {Invisible Text Rollover}
a span{display:none;}
a:hover span {
display:block; position:absolute; z-index:6;
background-color:transparent; text-align:center;
color: TEXT COLOR HERE;
font-size: 20px;
font-family: Script, Tahoma, Arial;
top: 350px;
margin-left: -150px;
height: 200px;
width: 300px; }
</style>


° HTML Part For A Link °

<a href="PAGE URL">LINK TEXT HERE
<span>APPEARING TEXT HERE</span></a>


" OR "
° HTML Part For An Image Link °

<a href="PAGE URL"><img src="IMAGE URL">
<span>APPEARING TEXT HERE</span></a>



Note:



CSS Part:


☼- color/size/family:
You can format the appearing text.

☼- top/margin-left:
You can adjust them where the text should be appear on your profile.

☼- height/width:
Change it to the size of your appearing text paragraph.


HTML Part:


☼- Replace/Insert the URLs, and the "Text" that shows up after "Mouseover" with your own.


║║║  ║║  ║  ║║  ║║║

║║║  ║║  ║  ║║  ║║║

Eingestellt von KhAk