NOVINKA: Získej 40 hodin praktických dovedností s AI – ZDARMA ke každému akreditovanému kurzu!
Hledáme nové posily do ITnetwork týmu. Podívej se na volné pozice a přidej se do nejagilnější firmy na trhu - Více informací.
Avatar
marcopolo2542001
Člen
Avatar
marcopolo2542001:26.7.2015 22:58

Ahoj,

mám v css daný kód :

.button{
    transition: height 2s;
    height: 100px;
}

.button:hover {
    height: 300px;
}

jde nějak udělat aby se mi po :hoveru napsal tam dole nějaký text ?
Mam samozdřejmě i další css v buttonu..Zajímá mě jen ten text...

Editováno 26.7.2015 22:59
 
Odpovědět
26.7.2015 22:58
Avatar
Jan Lupčík
Tvůrce
Avatar
Odpovídá na marcopolo2542001
Jan Lupčík:26.7.2015 23:07

Můžeš použít vlastnost <a href="http://­www.itnetwork­.cz/html-css/css-manual/pismo/con­tent-css-3-vlastnost-cesky-manual">content</a> (a pokud není :hover, nastavit ji prázdnou) nebo si vytvoř v tlačítku span s textem, který při nenajetí bude skrytý a při najetí bude viditelný (vlastnost <a href="http://­www.itnetwork­.cz/html-css/css-manual/pozico­vani/display-css-3-vlastnost-cesky-manual">displa­y</a>).

Nahoru Odpovědět
26.7.2015 23:07
TruckersMP vývojář
Avatar
marcopolo2542001
Člen
Avatar
Odpovídá na Jan Lupčík
marcopolo2542001:26.7.2015 23:16

Díky moc..
Může to být nějak takto ?

.button{
    transition: height 2s;
    height: 100px;
    content : none;
}

.button:hover {
    height: 300px;
    content: Muj text..;
}
Editováno 26.7.2015 23:17
 
Nahoru Odpovědět
26.7.2015 23:16
Avatar
Jan Lupčík
Tvůrce
Avatar
Odpovídá na marcopolo2542001
Jan Lupčík:27.7.2015 8:44

Ono to funguje jen s :after či :before. Úprava by mohla vypadat následovně:

.button {
    transition: height 2s;
    height: 100px;
}

.button:after {
    content: none;
}

.button:hover:after {
    height: 300px;
    content: "Můj text.";
}
Nahoru Odpovědět
27.7.2015 8:44
TruckersMP vývojář
Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 4 zpráv z 4.