Forum portalu Fan-Strefa.pl

Dla webmastera => Kodowanie => Wątek zaczęty przez: Zuzolinda w 28 Styczeń 2013, 18:01:25

Tytuł: Funkcja 'transition' - ???
Wiadomość wysłana przez: Zuzolinda w 28 Styczeń 2013, 18:01:25

Jestem właśnie w trakcie kodowania T-S.pl i chciałam zrobić w sidebarze projekty na zasadzie obrazków, na których, po najechaniu kursorem, znalazłby się opis. Wyczytałam, że jest za to odpowiedzialna funkcja "transition" w css'ie i spróbowałam. Niestety najwyraźniej robię to źle, bo tekst pojawia się poniżej obrazka... Czy byłby ktoś w stanie krótko mi to objaśnić? Byłabym bardzo wdzięczna! :)

Tytuł: Odp: Funkcja 'transition' - ???
Wiadomość wysłana przez: Viridiana w 28 Styczeń 2013, 18:15:10

owszem od tego jest transition czyli ulubiona funkcja na tumblru
a ogólnie musisz zrobić tak:

Kod: [Zaznacz]

<div class="KLASA"><img src="adres do obrazka" class="KLASA OBRAZKA" onmousedown="return false"align="left"/>
<div class="INNA KLASA">tekst</div></div>
i do css

Kod: [Zaznacz]

.KLASA{
    width:260px;} ->>>> to sobie zmień
 
 .KLASA OBRAZKA {
    width:260px;
    margin-bottom: 10px;}
 
 .INNA KLASA {
     position:fixed;
     width:240px;
    opacity: 0;
     margin-top: 279px;
     z-index:9999;
     -webkit-transition: all 0.7s ease-in-out;
     -moz-transition: all 0.7s ease-in-out;
     transition: all 0.7s ease-in-out;}
.INNAKLASA:hover {
     opacity: 1;}
powinno działać :P

ogólnie to te wszystkie marginy, weighty i tak dalej sobie pozmieniaj kopiowałam ze swojego starego kodu i już mi sie nie chce z tym nic robić

Tytuł: Odp: Funkcja 'transition' - ???
Wiadomość wysłana przez: Zuzolinda w 28 Styczeń 2013, 21:39:54

Teraz się zorientowałam, że masz to na swoim tumblrze, Moniko :P Wielkie dzięki! Nieoceniona jest Twa pomoc :D

PS. Temat do przeniesienia :)