Zdravim , vedel by mi niekto pomoct ? nefunguje mi transition , v chrome to nieco robi , ale firefox vobec. A nieje to to co som si predstavoval. Provlem bude ze kazdy odkaz ma iny background image.
Skusal som uz vsetko mozne , ako nahle to dam bez obrazkov a spravim kazdy taky isty len s farbou pozadia ide to...
Kód:
#header .main-menu {float:right;margin:0;padding: 0;height:80px;}
#header .main-menu ul {float:left;height:80px;padding:0;margin:0;list-style-type: none;}
#header .main-menu ul li {float:left;height:80px;margin:0;padding:0;background-image: none;
-webkit-transition: background-image .4s linear;
-moz-transition: background-image .4s linear;
-o-transition: background-image .4s linear;
-ms-transition: background-image .4s linear;
transition: background-image .4s linear;
}
#header .main-menu ul li a {float:left;padding:26px 20px 18px 65px;margin:0px;font:normal 16px 'PT Sans Narrow';color:#a1a1a1;
letter-spacing:1px;text-decoration:none;text-shadow: 1px 1px 1px #000000;line-height:110%;}
#header .main-menu ul li a:hover {color:#fff;}
#header .main-menu ul li.home {background: url('../img/blue_m_a.png') top center no-repeat ;}
#header .main-menu ul li.home:hover {background: url('../img/blue_m.png') top center;}
#header .main-menu ul li.home span {display:block;position:absolute;margin:2px 0 0 -47px;width:30px;height:30px;background: url('../img/home.png');}
#header .main-menu ul li.profil {background: url('../img/orange_m_a.png') top center no-repeat;}
#header .main-menu ul li.profil:hover {background: url('../img/orange_m.png') top center;}
#header .main-menu ul li.profil span {display:block;position:absolute;margin:2px 0 0 -47px;width:30px;height:30px;background: url('../img/profil.png');}
#header .main-menu ul li.referencie {background: url('../img/purple_m_a.png') top center no-repeat;}
#header .main-menu ul li.referencie:hover {background: url('../img/purple_m.png') top center;}
#header .main-menu ul li.referencie span {display:block;position:absolute;margin:2px 0 0 -47px;width:30px;height:30px;background: url('../img/referncie.png');}
#header .main-menu ul li.kontakt {background: url('../img/green_m_a.png') top center no-repeat;}
#header .main-menu ul li.kontakt:hover {background: url('../img/green_m.png') top center;}
#header .main-menu ul li.kontakt span {display:block;position:absolute;margin:2px 0 0 -47px;width:30px;height:30px;background: url('../img/kontakt.png');}
#header .main-menu ul li.lang {background: url('../img/grey_m_a.png') top center no-repeat;padding:0px 40px 0px 20px;}
#header .main-menu ul li.lang a {padding:0px;margin:23px 0 0 0;}
#header .main-menu ul li.lang .languages {display:none;}
#header .main-menu ul li.lang:hover {background: url('../img/grey_m.png') top center;}
#header .main-menu ul li.lang:hover .languages {display:block;position:absolute;background: url('../img/grey_m.png') top center;padding:22px 5px 22px 5px;margin:0 0 0 -120px;}
#header .main-menu ul li.lang .languages a {padding:0 5px 0 5px;margin: 0;float:left;text-decoration:none;}
#header .main-menu ul li.lang span {display:block;position:absolute;margin:33px 0 0 46px;width:13px;height:15px;background: url('../img/arrow.png') no-repeat;}
