Autor Zpráva
pospa669
Profil
Dobrý večer, chtěl jsem se zeptat, chtěl bych, že když mám normální img s definovaným class='neco' (je to v PHP), tak když na něj najedu myší, aby se změnil na druhý, popř aby to bylo v jednom obrazku, ale aby se to zmenilo s pomoci transition (transition:něco 0.5s;), kodovane v CSS (jinem oddelenem souboru, je to na PHP fusion). Pošlu kody jak to mam aktualne udelane, a chtel bych vedet, jak to opravit nebo jak to udelat znova a jinak, aby mi to fungovalo. Dekuji za odpovedi


PHP zaklad:
 echo "<a href='#' target='_blank'><img src='".THEME."images/fbdual.png' alt='facebook' class='socialfb' title='Facebook' /></a>";
(dual znamena, ze jsem to zkousel ty 2 obrazky vedle sebe v jednom), jinak je mam pojmenovane jako fb a fb-hover.

CSS:

.trojpanel-social {
  width: 266px;
  height: 229px;
  margin-left: 420px;
  margin-top: -229px;
  background-color:transparent;
}
.socialfb {
  padding-right: 4px;
  padding-bottom:4px;
transition:text-indent 0.5s;
display:block; width:129px; height:112px; overflow:hidden;
}
.socialfb:hover {
text-indent:-129px;
}
margin
Profil *
Pokud to chápu, tak chceš něco takového: http://teststranek.kvalitne.cz/blend-hover-01/
Princip ne ten, že jsou dva obrázky (elementy) nad sebou a jednomu z nich (kdo uhádnul, že hornímu, má bludišťáka) se mění průsvitnost.

Samotnou změnu IMG nejde animovat.
Některé prohlížeče umí animovat změnu background-image. Pokud jsem správně pochopil CSS specifikaci, tak přechod mezi background-image nepatří mezi animovatelné vlastnosti, takže pomalá změna obrázku na pozadí je od prohlížečů jakýsi bonus.

Vaše odpověď

Mohlo by se hodit


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: