Смяна на бутони

SandPrince

Registered
Почнах да си правя личен сайт - на моа. Да ама искам да направя бутоните на сайта ми от Английски като ги посоча с курсора да стават на Български ( Пример: бутона "Home" като го посоча да става на "Начало" ) - виждал съм такъв ефект но не знам как да го постигна. Предполагам, че става с CSS или JavaScript ама не съм сигурен , пък и кода не знам как става.... ако знаете как става помагайте
 
ето това направих с ЦСС по този урок http://web-tourist.net/login/login/view.php?st=584

предполагам има и излишни неща от ЦСС-а ама нямам време да ги гледам :)


DEMO
Код:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<title>Untitled Document</title>
<style>
.efect{
display:block;
text-align:center;
width:100px;
height:20px;
border: 1px solod gray;
background-color:#99FFCC;
position: relative;
z-index: 0;
}

.efect:hover{
background-color: transparent;
z-index: 50;
}

.efect span{
display:block;
text-align:center;
width:100px;
height:20px;
position: absolute;
background-color: lightyellow;
left: -1000px;
border: 1px solid gray;
visibility: hidden;
color: black;
text-decoration: none;
}



.efect:hover span{
visibility: visible;
top: 0;
left: 0px;

}
</style>
</head>
<body>
<a class="efect" href="#">HOME<span>NACHALO</span></a>
</body>
</html>
 
mute каза:
ето това направих с ЦСС по този урок http://web-tourist.net/login/login/view.php?st=584

предполагам има и излишни неща от ЦСС-а ама нямам време да ги гледам :)


DEMO
Код:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<title>Untitled Document</title>
<style>
.efect{
display:block;
text-align:center;
width:100px;
height:20px;
border: 1px solod gray;
background-color:#99FFCC;
position: relative;
z-index: 0;
}

.efect:hover{
background-color: transparent;
z-index: 50;
}

.efect span{
display:block;
text-align:center;
width:100px;
height:20px;
position: absolute;
background-color: lightyellow;
left: -1000px;
border: 1px solid gray;
visibility: hidden;
color: black;
text-decoration: none;
}



.efect:hover span{
visibility: visible;
top: 0;
left: 0px;

}
</style>
</head>
<body>
<a class="efect" href="#">HOME<span>NACHALO</span></a>
</body>
</html>

а е точно това ми трябваше
 

Back
Горе