Autor Zpráva
Trax
Profil
Ahoj lidi,

jen by mě zajímalo, zda v CSS3 je nějaká možnost aplikovat transition na dva různé divy současně.

Např: Mám ikonku, na kterou když ukážu, tak změní pomocí transition barvu a současně se mi otočí např o 90° obrázek, který je umístěn někde jinde na stránce. Hledal jsem na netu, ale asi to neumím správně napsat, protože jsem žádnou podobnou problematiku nenašel.


Děkuji za odpovědi i případné rady. :)
Antik4
Profil
Hover element musí být před elementy, pro které chceš udělat efekt. JsFiddle
Trax
Profil
Ooo super. Díky moc. ;)
Trax
Profil
Ještě by mě zajímalo, zda by šlo zároveň transition aplikovat na prvky <a> v divu navigace, a na <div id="#box"> v divu obsah.

HTML:
<div id="navigace">
  <span class="jmeno_sekce">
    <a href="#"><img src="..."></a>
  </span>
</div>

<div id="obsah">
  <div id="box">text</div>
</div>

Můžete prosím poradit? Zkouším to všelijak a doufám, že to nějak jde.
joe
Profil
Trax:
který je umístěn někde jinde na stránce
Záleží kde ten element je. Není pravda, že "hover element" musí být před elementy, pro které se dělá efekt. Klidně mohou být animované elementy uvnitř a mohou být pozicované absolutně.

Ještě by mě zajímalo, zda by šlo zároveň transition aplikovat na prvky...
Čistě přes CSS to nejde, pokud myslíš při najetí na odkaz. Můžeš ale JavaScriptem přidat nějakou třídu elementu #box a tím se ten efekt provede.
Trax
Profil
joe:
Byl by nějakej příklad na ten javascript? :) S javascriptem jsem ještě pořádně nepracoval...
joe
Profil
Trax:
Třeba takto.
Trax
Profil
joe:
To je super, díky joe. :) Ale tak nějak teď nevím, jak to upravit pro svůj případ. Jak tam mám <span class="jmeno_sekce"> tak potřebuju aby pro každou sekci měl box jinou barvu. Možná bych na to po chvíli přišel, ale sedím nad tím už několik hodin a nějak mi to nemyslí. Mohl bys mi pomoct ještě s tímto prosím tě?
ed11
Profil
Možná ti pomůže i tohle když to opravíš ku prospěchu svému a pokusíš se odstranit absolutní pozicování..
Trax
Profil
Uff, tak už jsem na to přišel. :) Ještě jednou díky joe. ;)

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: